Page 2 of 2

Re: Go Diagram Graphics

Posted: Wed Mar 12, 2014 7:52 am
by oca
Hello,

regarding to go diagram, I'm currently working on a quick javascript/html5 hack wich allow me to play them.
still very buggy, but you may get an idea here :

*** WARN, works with CHROME and Firefox only ***

http://picshell.ovh.org/go/test.html


click on next / prev to play the "numbered" moves
click on the diagram to add a black stone (if click on a black stone, the color toggle)
remove a stone not done yet...


I'have also done a chrome extension which allows me to play all the diagram of the forum the same way...

Image

I may share the code or give more explanations if someone is interested.

Re: Go Diagram Graphics

Posted: Wed Mar 12, 2014 3:36 pm
by Bonobo
oca wrote:[..]

I'have also done a chrome extension which allows me to play all the diagram of the forum the same way... [..]

I may share the code or give more explanations if someone is interested.
Very interesting. I’m not a coder but I might like such an extension :-)

Greetz, Tom

Re: Go Diagram Graphics

Posted: Fri Mar 14, 2014 3:33 am
by oca
So here is the extension for chrome.

What it does :

After installing the extension in Chrome, when you click on the link below go diagram "Click Here To Show Diagram Code", you will see another diagram with buttons that allow to play the "numbered" moves one at time.

The diagram is also "playable", the behaviour is a bit too basic but that's better than nothing... if you click on an empty place, that will place a black stone, if you click on a black stone, it will toggle to a white stone, and if you click a white stone, it will be removed...

A warn first
Once the extension is installed, keep in mind that the rendered "playable" diagram is not under the responsability of "life in 19x19", so if there is something wrong in the diagram and you talk about that, people may even not know what you are talking about...

How to install :

You first need to donwload the extension for chrome, which come in a file called "godiag.crx"

but before you go the download page, I need to tell you that I wrote the plugin myself and I can grant you that it is free from any commercial, spyware, malware or what ever you may not like .. only go stuff inside.

The crx file is a zip file which can be opened with editor like "winzip or 7zip" so you can verify that for yourself in the code itself (but you will then need some understanding of javascript :scratch: ...)

Well, if your still interested :tmbup: ... here is the link to the plugin : (I tryied to attache the file to that post but .crx files are not accepted... so I just put a quick link on a web page of mine).

http://picshell.ovh.org/go/

Just click on the link, chrome may tell you that it can't directly install it from that site, but that's ok, you just need to get the file for now and then follow these steps :

once you got the file, go to chrome extension page (just type "chrome://extensions/" as a url to go there) and drop the "godiag.crx" file to the extension page, that's it !

How to uninstall :
You can remove it whenever you want from the extension page of chrome, by clicking on the trashcan icon.

Are there known problems
The extension will run on your computer (not on the server side, which even doestn't know you are using an extension...), so it will not slow down the server. I didn't noticed any problem using it myself. The extension is written to be the lightest as possible so it should not disturbe your journey, even with page that contains multiple diagrams.

Limitations
The extension doesn't cover all the functionalities of the go diagram (and will probably never do).
That's close enougth for me at least...simple one should work just fine.
Feel free to tell me if something is wrong or missing.

Hope you will like it.


PS : to admins, Hope it's ok for you too as nothing append on the server side... but if you just don't like that idea of plugin, for any reason, just tell me and I will remove everything related to this plugin.

Re: Go Diagram Graphics

Posted: Fri Mar 14, 2014 4:18 am
by Jordus
I have no problem with the plug-in whatsoever. I'd actually like to take a look at the code if you are willing to show it.

:salute: :tmbup:

Re: Go Diagram Graphics

Posted: Fri Mar 14, 2014 4:54 am
by oca
Jordus wrote:I have no problem with the plug-in whatsoever. I'd actually like to take a look at the code if you are willing to show it.


thanks, that's nice ! here are some more technical details :

The plugin contains two files :

- manifest.json is a manifest that tells chrome on what url the plugin is active
- script.js is a script file (javascript) that do the job.

Code can be seen here (I just changed extension to .txt so that the code will appear directly in the browser)

http://picshell.ovh.org/go/manifest.txt
http://picshell.ovh.org/go/script.txt

Note that you can also see the code by just "unziping" the crx file is actually just a plain zip file containing these two files.

There are not that much to say about the manifest file.

For the script file, it was a bit more tricky to write, as I had to "inject" my javascript function in the DOM of the page, that's why it's so difficult to read with all that '\' stuff at the end of lines

A better way to see that code and try it is to go here

http://picshell.ovh.org/go/test.html

and then use the " show code source" option of chrome to see the code.

This code is the same in a "non plugin" form. (Actully I write my code using that file, and then convert it to the plugin form using another transformation script)

basicly, the script is working like that :

find all html "code" tags, if they contains a "[go]" tag, then process their content to draw a new goban with the added functionality using an html5 canvas .

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 1:18 am
by oca
Hi,

Just wanna let you know that I published my "go diagram player" tool on google web store so it's now easier to get it if you want to.

https://chrome.google.com/webstore/deta ... ncdk?hl=fr

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 6:06 am
by Bonobo
Thank you, Oca, I loaded it but I’m somewhat lost on how to use it … e.g. here: viewtopic.php?f=12&t=10462 … when I click a diagram Chrome still just wants to download the SGF file.

Am I misunderstanding something?

TIA, Tom

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 6:51 am
by oca
Hi Bonobo,

The original go diagram is not modified, you need to click on the "Click Here To Show Diagram Code" link,
and then you should see another diagram there that you can play with.

screenshoot.jpg
screenshoot.jpg (85.18 KiB) Viewed 6291 times

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 8:47 am
by Bonobo
oca wrote:[..] you need to click on the "Click Here To Show Diagram Code" link,
and then you should see another diagram there that you can play with.
Ah, thank you, very cool :-)

Greetings, Tom


<edit>

And I just rated it on the Chrome Webstore and shared it wide and far :-D

</edit>

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 10:53 am
by RBerenguel
We need to be able to check it here!

Click Here To Show Diagram Code
[go]$$B
$$ ---------------------------------------
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . 4 . . . 2 . . . . . |
$$ | . . . O . . . . . , . . . . . X . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . 3 . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . 6 . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . 5 , 9 . . . . , . . . . . , 1 . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . 8 . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . X . . . . . , . . . . . O . . . |
$$ | . . . . . . . . . 7 . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ | . . . . . . . . . . . . . . . . . . . |
$$ ---------------------------------------[/go]

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 11:02 am
by RBerenguel
Bug report (very minor, but took me a few minutes to figure out!)

I use (out of habit) lifein19x19.com, and the extension checks/works with www.lifein19x19.com!

Re: Go Diagram Graphics

Posted: Wed Jun 18, 2014 12:38 pm
by oca
RBerenguel wrote:Bug report (very minor, but took me a few minutes to figure out!)

I use (out of habit) lifein19x19.com, and the extension checks/works with http://www.lifein19x19.com!


Oh ok... thanks I will check that !