- Compatible XF Versions
- 1.0
- 1.1
- 1.2
- 1.3
- 1.4
- 1.5
Not really a request but noticed this thread here:
https://xenforo.com/community/threads/chessboard-for-xenforo-available-or-not.117371/
So I decided to take it upon myself to do a simple, very simple example of what the OP was looking for, this can of course be taken much further and at some point I might look into doing so but I don't see a need at the moment. This useshttp://pgn4web.casaschi.net for the javascript source, if you wish you can download the files yourself fromhttps://sourceforge.net/projects/pgn4web/files/ and change the link accordingly. The way I implemented it makes it so you won't have to download any other files.
As for the "board" itself there is much more customization available here:
https://sourceforge.net/p/pgn4web/wiki/BoardWidget_instructions/
This uses the SMF style of BBCode, [PGN]
This is an export of the BBCode directly from the BB Code & Smilies section of the XenForo Admin Panel, so that is where you will import the XML.
Don't wish to import it?
Add it in yourself using the following:
(You can of course rename this to whatever you wish.)
Code:
<script type="text/javascript"> "use strict"; var pgn4webURL = "http://pgn4web.casaschi.net"; if (!document.getElementById("pgn4webEncoderScript")) { document.write('<script id="pgn4webEncoderScript" type="text/javascript" src="' + pgn4webURL + '/pgn-encoder.js"></' + 'script>'); } </script> <script type='text/javascript'> "use strict"; var pgn4webTextareaIdNum; if (pgn4webTextareaIdNum === undefined) { pgn4webTextareaIdNum = 1; } var pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++; document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>"); </script>{text}</textarea> <script type='text/javascript'> "use strict"; var pgnText = document.getElementById(pgn4webTextareaId).value.replace(/<.*?>/g, ' '); var height = 268; var multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m; if (multiGamesRegexp.test(pgnText)) { height += 34; } document.write("<iframe src='" + pgn4webURL + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=WdSO&dcs=LHCg&bbcs=LHCg&hm=b&hcs=lF6v&bd=c&cbcs=UJuI&ctcs=BoVy&hd=j&md=f&tm=13&fhcs=$$$$&fhs=14&fmcs=$$$$&fccs=v71$&hmcs=M___&fms=14&fcs=m&cd=i&bcs=WdSO&fp=13&hl=t&fh=b&fw=p&pe=" + EncodePGN(pgnText) + "' frameborder=0 width=100% height=" + height + " scrolling='no' marginheight='0' marginwidth='0'>your web browser and/or your host do not support iframes as required to display the chessboard</iframe>"); </script>
USE:
[pgn] ... PGN data ... [/pgn]
Imageshttps://xenforo.com/community/threads/chessboard-for-xenforo-available-or-not.117371/
So I decided to take it upon myself to do a simple, very simple example of what the OP was looking for, this can of course be taken much further and at some point I might look into doing so but I don't see a need at the moment. This useshttp://pgn4web.casaschi.net for the javascript source, if you wish you can download the files yourself fromhttps://sourceforge.net/projects/pgn4web/files/ and change the link accordingly. The way I implemented it makes it so you won't have to download any other files.
As for the "board" itself there is much more customization available here:
https://sourceforge.net/p/pgn4web/wiki/BoardWidget_instructions/
This uses the SMF style of BBCode, [PGN]
This is an export of the BBCode directly from the BB Code & Smilies section of the XenForo Admin Panel, so that is where you will import the XML.
Don't wish to import it?
Add it in yourself using the following:
(You can of course rename this to whatever you wish.)
Code:
<script type="text/javascript"> "use strict"; var pgn4webURL = "http://pgn4web.casaschi.net"; if (!document.getElementById("pgn4webEncoderScript")) { document.write('<script id="pgn4webEncoderScript" type="text/javascript" src="' + pgn4webURL + '/pgn-encoder.js"></' + 'script>'); } </script> <script type='text/javascript'> "use strict"; var pgn4webTextareaIdNum; if (pgn4webTextareaIdNum === undefined) { pgn4webTextareaIdNum = 1; } var pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++; document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>"); </script>{text}</textarea> <script type='text/javascript'> "use strict"; var pgnText = document.getElementById(pgn4webTextareaId).value.replace(/<.*?>/g, ' '); var height = 268; var multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m; if (multiGamesRegexp.test(pgnText)) { height += 34; } document.write("<iframe src='" + pgn4webURL + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=WdSO&dcs=LHCg&bbcs=LHCg&hm=b&hcs=lF6v&bd=c&cbcs=UJuI&ctcs=BoVy&hd=j&md=f&tm=13&fhcs=$$$$&fhs=14&fmcs=$$$$&fccs=v71$&hmcs=M___&fms=14&fcs=m&cd=i&bcs=WdSO&fp=13&hl=t&fh=b&fw=p&pe=" + EncodePGN(pgnText) + "' frameborder=0 width=100% height=" + height + " scrolling='no' marginheight='0' marginwidth='0'>your web browser and/or your host do not support iframes as required to display the chessboard</iframe>"); </script>
USE:
[pgn] ... PGN data ... [/pgn]
