User_Notes_simplemachines

simplemachines forum platform integration

Users of simplemachines based forums can integrate the pgn4web chessboard just by adding bbcode tags to their posts, like this:

[pgn] ... PGN data ... [/pgn]

screenshot

integration guidelines

The following procedure is has been tested with simplemachines version 2.0.x (see comment below the article for simplemachines version 1.1.x).

The forum administrator should install and enable the Custom BBCodes Manager module, or similar module to allow for the creation of custom BBCodes.

From the Custom BBCodes Manager module admin page the forum administrator should then create the custom bbcode for the [pgn]{content}[/pgn] tag; please refer to the module documentation for guidelines how to set the different options.

The reccomended value for the HTML used for the tag is the following (for some unknown reason it works better when entered as a single line with no newlines):

<script type='text/javascript'> "use strict"; var pgn4webPath = "/pgn4web"; var pgn4webTextareaIdNum; if (pgn4webTextareaIdNum === undefined) { pgn4webTextareaIdNum = 1; } var pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++; document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>"); </script>{content}</textarea> <script type='text/javascript'> "use strict"; document.getElementById(pgn4webTextareaId).value = 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(document.getElementById(pgn4webTextareaId).value)) { height += 34; } document.write("<iframe src='" + pgn4webPath + "/board.html?am=l&amp;d=3000&amp;ss=26&amp;ps=d&amp;pf=d&amp;lcs=WdSO&amp;dcs=LHCg&amp;bbcs=LHCg&amp;hm=b&amp;hcs=lF6v&amp;bd=c&amp;cbcs=UJuI&amp;ctcs=BoVy&amp;hd=j&amp;md=f&amp;tm=13&amp;fhcs=$$$$&amp;fhs=14&amp;fmcs=$$$$&amp;fccs=v71$&amp;hmcs=M___&amp;fms=14&amp;fcs=m&amp;cd=i&amp;bcs=WdSO&amp;fp=13&amp;hl=t&amp;fh=b&amp;fw=p&amp;pi=" + pgn4webTextareaId + "' 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>

Please remember to set the variable pgn4webPath above to the path of the pgn4web folder on your site.

Please note these settings apply a predefined set of colors and options to match the default simplemachines template; if you need to change any of the colors and options (the parameters after board.html in the code above) you can refer to the board widget instructions wiki page or ask for support.

The instructions above require pgn4web 1.91 or later and requires that simplemachines and pgn4web are on the same domain.

In case you need to install simplemachines and pgn4web on different domains, please use the following alternative value for the HTML used for the tag. Please note that this alternative solution limits the size of the PGN data to approximately 2000 characters:

Alternative HTML used for the tag:

<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>{content}</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&amp;d=3000&amp;ss=26&amp;ps=d&amp;pf=d&amp;lcs=WdSO&amp;dcs=LHCg&amp;bbcs=LHCg&amp;hm=b&amp;hcs=lF6v&amp;bd=c&amp;cbcs=UJuI&amp;ctcs=BoVy&amp;hd=j&amp;md=f&amp;tm=13&amp;fhcs=$$$$&amp;fhs=14&amp;fmcs=$$$$&amp;fccs=v71$&amp;hmcs=M___&amp;fms=14&amp;fcs=m&amp;cd=i&amp;bcs=WdSO&amp;fp=13&amp;hl=t&amp;fh=b&amp;fw=p&amp;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>

Please remember to set the variable pgn4webURL above to the URL of the pgn4web server you plan to use.

For a better appearence of the post editor, you might want to upload the image below as button for the pgn tag:

caveats

  • HTML tags are stripped from the PGN data, removing all text between < and > characters; please make sure your PGN data does not contain < and > characters.
  • the pgn4web chessboard might not appear when using the the simplemachines post preview functionality; this seems a limitation of the custom bbcode module.

further customizations

With minor modifications to the integration guidelines described above other bbcode tags can be created for specialized applications, for instance taking advantage of the board widget puzzle support.


Related

Wiki: BoardWidget_instructions
Wiki: BoardWidget_puzzle
Wiki: Contribute
Wiki: Index
Wiki: UserContributedMaterial
Wiki: User_Notes_Web_Platforms
Wiki: User_Notes_mybb

Discussion

  • Anonymous

    Anonymous - 2013-07-18

    Originally posted by: pa...@casaschi.net

    how to stop the games from autoplaying

    Some forum administrators prefer the chessboard to load without automatically starting autoplaying the games. In order to achieve that, simply replace in the bbcode definition am=l with am=n

     

    Last edit: Anonymous 2016-07-02
  • Anonymous

    Anonymous - 2014-06-25

    Originally posted by: pa...@casaschi.net

    the puzzle tag

    The pgn tag can be easily modified into a tag optimized for puzzles, hiding the move text until the user clicks on the prompt in order to show the puzzle solution. In order to achieve that, simply replace in the bbcode definition am=l with am=n, hd=j with hd=v and md=f with md=p.

     
  • Anonymous

    Anonymous - 2014-09-29

    Originally posted by: pa...@casaschi.net

    simplemachines version 1.1.x support

    The method above works with simplemachines version 2.0 and above because the Custom BBCode Manager module only support those platforms.

    For use with simplemachines version 1.1.x this alternative module for creating custom bbcodes can be used. This module only supports the older versions of simplemachines; for use with later versions of simplemachines, please see this support thread.

     

    Last edit: Anonymous 2017-07-26

Log in to post a comment.

Want the latest updates on software, tech news, and AI?
Get latest updates about software, tech news, and AI from SourceForge directly in your inbox once a month.