My favorites | Sign in
Logo
                
Search
for
Updated Aug 10, 2010 by paolocas...@gmail.com
Labels: Phase-Deploy
  User_Notes_vbulletin  
notes about integration with the vbulletin forum platform

vbulletin forum platform integration

Users of vbulletin based forums can integrate the pgn4web chessboard in their posts using a custom bbcode for PGN games, like this:

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

No vbulletin license is available for testing; the integration code has been validated with the vbulletin demo facility, but there is no pgn4web test site for vbulletin. Check the users' gallery for usage examples (look for sites with the V indicator).


screenshot


integration guidelines

The forum administrator should create a new BBcode with BBcode tag name as pgn

The reccomended value for the HTML replacement string is:

<script type='text/javascript'>
var pgn4webPath = "/pgn4web";
var pgn4webTextareaIdNum;
if (pgn4webTextareaIdNum == undefined) { pgn4webTextareaIdNum = 1; }
pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++;
document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>");
</script>
{param}
</textarea>
<script type='text/javascript'>
document.getElementById(pgn4webTextareaId).value = document.getElementById(pgn4webTextareaId).value.replace(/<\s*br\s*\/>/gi, ' ');
multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m;
if (multiGamesRegexp.test(document.getElementById(pgn4webTextareaId).value)) { height = 302; }
else { height = 268; }
document.write("<iframe src='" + pgn4webPath + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=____&dcs=RsCo&bbcs=RsCo&hm=b&hcs=FpBE&bd=c&cbcs=YKqR&ctcs=BoBo&hd=j&md=j&tm=13&fhcs=$$$$&fhs=80p&fmcs=$$$$&fccs=v71$&hmcs=VtCE&fms=80p&fcs=m&cd=i&bcs=____&fp=13&hl=t&fh=b&fw=p&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 vbulletin 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.

It is recommended to switch on the following options for the pgn BBcode tag: Remove Tag If Empty, Disable BB Code Within This BB Code and Disable Smilies Within This BB Code.
The icon below can be used as button image:

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

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

<script type="text/javascript">
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'>
var pgn4webTextareaIdNum;
if (pgn4webTextareaIdNum == undefined) { pgn4webTextareaIdNum = 1; }
pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++;
document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>");
</script>
{param}
</textarea>
<script type='text/javascript'>
pgnText = document.getElementById(pgn4webTextareaId).value;
pgnText = pgnText.replace(/<\s*br\s*\/>/gi, ' ');
multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m;
if (multiGamesRegexp.test(pgnText)) { height = 302; }
else { height = 268; }
pgnEncoded = EncodePGN(pgnText);
document.write("<iframe src='" + pgn4webURL + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=____&dcs=RsCo&bbcs=RsCo&hm=b&hcs=FpBE&bd=c&cbcs=YKqR&ctcs=BoBo&hd=j&md=j&tm=13&fhcs=$$$$&fhs=80p&fmcs=$$$$&fccs=v71$&hmcs=VtCE&fms=80p&fcs=m&cd=i&bcs=____&fp=13&hl=t&fh=b&fw=p&pe=" + pgnEncoded + "' 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.


caveats

  • with certain server configurations, vbulletin might display a blank page when saving an edited post
    • issue: there is a malfunctioning of vbulleting related to editing posts containing the [pgn] bbcode. After editing an existing post containing a [pgn] tag, when using the save command, vbulletin displays a blank page while endlessly trying to load the next page. Please note that the modifications to the post are actually saved, just the transition to the next vbulletin page fails.
    • workaround: three alternative options are available:
      • in the forum admin control panel navigate to Settings -> Options -> General Settings -> Disable AJAX Features and change the item Disable AJAX Features from the default Enable ALL AJAX Features to Disable Problematic AJAX Features, or
      • use the go advanced command instead of the save command when editing a post, or
      • live with the blank page, manually going back to vbulletin after saving changes to a post.

Sign in to add a comment
Powered by Google Project Hosting