ThickBox Installation

Credit

This package uses the ThickBox jQuery extension by Cody Lindley. Please visit Cody’s and jQuery’s sites and support their projects. You can also help support jQuery and SkyBlueCanvas by clicking the book title to the left and purchasing John Resig’s book “Pro JavaScript Techniques”. John is one of the most brilliant JavaScript Developers working today and this book will not disappoint you.

Abstract

This document gives step-by-step instructions for installing the ThickBox-compatible version of the SkyBlueCanvas Gallery Module.

Note

The version of ThickBox included in this package is slightly modified from the official version by Cody Lindley. The modifications are very minor and are outlined at the end of this document.

Installation

1. Go to /skyblue/data/modules/ and replace the file named mod.portfolio.php with the file named mod.portfolio.php included in this package.
2. Open the file named thickbox.js included in this package and change the two variables at the very top of the file as shown below:

var tb_pathToImage = "data/skins//images/loadingAnimation.gif";
var tb_MacFFBGHackImg = "data/skins//images/macFFBgHack.png";

3. Copy the file named thickbox.js to /skyblue/data/skins//js/
4. Copy the file named thickbox.css to /skyblue/data/skins//css/
5. Copy the file named loadingAnimation.gif to /skyblue/data/skins//images/
6. Copy the file named macFFBgHack.png to /skyblue/data/skins//images/
7. Log into your SkyBlueCanvas admin control panel and go to:
   Collections > Gallery > Settings
   and set the Navigation selector to ‘Slide Show’ then click Save.

That’s it. You’re finished. ThickBox for SkyBlueCanvas is now installed.

ThickBox Change Log

Changed the FF Mac Hack code to attach the styles to class ‘TB_overlayMacFFBGHack’ dynamically. This change was made to thickbox.js near line 51. The code is shown below.

$(".TB_overlayMacFFBGHack").css({
    "background": "url(" + FF_MAC_IMG + ") repeat"
});