search

mliebelt / pgn-viewer

Simple PGN viewer with the necessary features to display chess games
GNU General Public License v3.0
161 stars 44 forks source link

[Feature Request] separate the generated divs / Move to markup #25

Open LocutusOfPenguin opened 8 years ago

LocutusOfPenguin commented 8 years ago

Hi,

right now the JS file generate the other divs from the board-div (id). I would like to put the divs inside the markup so i can style their place myself. For example, i can give the IDs as parameter inside.

Jürgen

mliebelt commented 8 years ago

I don't understand your request. Just as some background: I use in the implementation chessboardjs at it is. I just wrap the div of the chessboard with some more divs.

Do you have example code that explains what you would like as an API? So some HTML code with embedded Javascript, that shows what a better API should look like.

LocutusOfPenguin commented 8 years ago

The code is so: give a ID of the board, and the program automatically (!!!) extend the dom with for example a move div. I want it this way: div id="board" /div alot of other html code div id="moves"/ /div

so, in my example i start your code with giving the ID's "board" & "moves". This allows me to stlye the output MYSELF.

An example y can find at "picochess" (but i hope this is clear enough) Jürgen

mliebelt commented 8 years ago

But how should the program (some Javascript code inside the HTML code) guess which one of the many divs in one that should be used to expand the board, the moves, the edit part, ...?

At the moment, I am able to have many (different) boards in different modes on the same HTML page (which is needed). So the only way to do it that way is to give the viewer (the Javascript part) the hint which elements are the ones that stand for board, moves, ...

I have to think about that, and try to come up with a complete example (HTML and Javascript) to show it.

Do you mean by your picochess reference the following? https://github.com/jromang/picochess/blob/master/web/picoweb/templates/board2.html

LocutusOfPenguin commented 8 years ago

giving its parameters at startup code (if y want, y can make the asked extra parameters extend the current way - if not given => generate the divs itself => this way, the program behaves same as now). Actually y only need to check if some IDs given, and then jump over the "generate div-in-dom code"

Yes, this is the code (board2.thml). But to test it out for YOU, y need to put all these code running. I hope y can understand it without checking out this project :-)

rohandalvi commented 7 years ago

@LocutusOfPenguin do you mean to say that you be allowed to have different div's for say the board itself and the moves pgn ?

Seems to me that the current implementation does not allow to specify a div id for moves explicitly. It would be nice to have this feature. Although I am not sure if it already exists. @mliebelt

LocutusOfPenguin commented 7 years ago

@rohandalvi yes, exactly. I know its not inside. But implementing it (as said in my last post), cant be too complex = Check the startup parameters, and jump over the dom-create-code for these div's.

For example here: http://mliebelt.github.io/PgnViewerJS/docu/examples2.html#1001 The JS code generate the moves div by itself, and its hard to style this (afterwards). Its also the same for the edit mode - here y should be able to provide more divIDs. Similar case. For the user only the startup call changes. If y dont want this, y can work with defaults (which means, the program api doesnt chage => program generate divs itself as now).

This would make this project more flexible!

LocutusOfPenguin commented 7 years ago

And for reference - here is a pict from our picochess webserver (generated from this board2.html). As y can see, we have the moves somewhere else :-) https://github.com/LocutusOfPenguin/picochess/blob/master/dgt/test/webserver73.jpg

mliebelt commented 7 years ago

The feature does not exist at the moment. I have understood what the benefit of that feature would be (thanks to @LocutusOfPenguin for the reference above, makes it more clear), and I have to think about a proper solution. The base idea would be:

So yes, it is a useful feature, and I will add it to the project (when I have the time to). Have to refactor the part that creates the UI, though.

mliebelt commented 7 years ago

The feature does not exist at the moment. I have understood what the benefit of that feature would be (thanks to @LocutusOfPenguin for the reference above, makes it more clear), and I have to think about a proper solution. The base idea would be:

See the wiki page I have added here. I want to document there some of the decisions, and perhaps problems. Just want to play a little bit with the possibilities of GitHub.

mliebelt commented 7 years ago

Provided a first version that works, see http://mliebelt.github.io/PgnViewerJS/docu/examples2.html#1217 for a small example how to use it. In the directory examples, there is the file ticket25.html that shows that in greater detail.

I would be glad to get some feedback to that implementation.

LocutusOfPenguin commented 7 years ago

Does it get a new version number? (my question is already a vote for it, ha)

mliebelt commented 7 years ago

I have just released version 0.9.3, I hope that is visible for you as well. Sometimes, you have to reload pages, because browsers cache very aggressive. Or do I not understand the question?

LocutusOfPenguin commented 7 years ago

Oh...okay, forget it please.

I will lateron try it out (busy with "voice" these days). But yr example looks already very good.

mliebelt commented 3 years ago

When retesting all tickets, I found this one to be broken (again). Not sure what to do about it, so I open the ticket again.