/* Copyright Claude Needham gxxaxx@gmail.com All rights reserved
Please refrain from using this script without permission.
This is how I make my living.
If you would like to use the script contact me. We can work something out.
You can get a javascript without stealing it (I'll keep the price low).
And I can live in a house instead of a station wagon.
*/
/*
BTN2PIC:
on inclusion in the webpage will automatically init itself.
look for an image with id="picimage"
if it finds one, script will convert any image with _b.jpg type name to a button
(note: it is also necessary to have ".." somewhere in the alt)
if image is clicked the graphic associated with the button is loaded into the picimage location.
and, the piccaption is altered.
Requires:
1) a target display image (large size one) with id="picimage" (case sensitive)
2) Button images have a name that is same as larger image with _b added
3) In the alt of the button anything following the .. is used as the caption.
In the above four example all will work since the stuff in front of the .. is clipped off
4) A line to load the javascript
5) A noscript section to alert others what they are missing.
Optional:
1) id="piccaption" this will update with the caption from the current button clicked. It is required that
button alt have ".." somewhere in it, but there is no requirement for a piccaption
1b) name="piccaption" this functions the same as the id, but allows for the inclusion of more than 1.
2) id="piccaption2" you can have a second string that is updated.
The alt in the button will have a form such as "..caption 1 text...caption 2 text"
2b) name="piccaption2" same as above.
3) id="piclink" this updates the link with a page given by button.
if button graphic is "myname01_b.jpg" then href = dirFromPreviousHref + myname01 + ".html"
3b) name="piclink"
*/
// this is same as putting in doc
window.onload = init;
var isbuttonregx = /^.*\.\./;
var altsep = "...";
var picimageID = "picimage";
var piccaptionID = "piccaption";
var piccaption2ID = "piccaption2";
var piclinkID = "piclink";
var closeupID = "closeupctrl";
var btnextension = "_b";
var clupextension = "-closeup";
var objimage = null;
var objcaption = null;
var objcaption2 = null;
var objlink = null;
var objcloseup = null;
var objcapadditional = null;
var objcapadditional2 = null;
var objlinkadditional = null;
var iscloseup = false;
var objcloseuptext = null;
var objcloseuptextalt = "Click to restore";
function init() {
initbtns();
initcloseup();
}
function initcloseup() {
if (!(objimage)) {
// discontinue setup there is no master image on this page.
return;
}
objcloseup = document.getElementById(closeupID);
if (!(objcloseup)) {
return;
}
objcloseup.onclick = clupProc;
objcloseup.style.cursor = 'pointer';
objcloseuptext = objcloseup.innerHTML;
}
function clupProc() {
if (iscloseup) {
clupUndo();
} else {
clupDo();
}
clupSetText();
}
function clupDo() {
iscloseup = true;
var pictoload = objimage.src;
pictoload = pictoload.replace(".jpg",clupextension + ".jpg");
objimage.src = pictoload;
}
function clupUndo() {
iscloseup = false;
var pictoload = objimage.src;
pictoload = pictoload.replace(clupextension + ".jpg",".jpg");
objimage.src = pictoload;
}
function clupSetText() {
if (!(objcloseup)) {
return;
}
if (iscloseup) {
objcloseup.innerHTML = objcloseuptextalt;
} else {
objcloseup.innerHTML = objcloseuptext;
}
}
function initbtns() {
objimage = document.getElementById(picimageID);
objlink = document.getElementById(piclinkID);
objlinkadditional = document.getElementsByName(piclinkID);
if (!(objimage)) {
// discontinue setup there is no master image on this page.
return;
}
objcaption = document.getElementById(piccaptionID);
objcaption2 = document.getElementById(piccaption2ID);
objcapadditional = document.getElementsByName(piccaptionID);
objcapadditional2 = document.getElementsByName(piccaption2ID);
for (var i = 0 ; i < document.images.length; i++) {
var imgobj = document.images[i];
var imgsrc = imgobj.src;
var imgalt = imgobj.alt;
var isbutton = (imgsrc.indexOf(btnextension) > -1)? true: false;
if (isbutton) {
if ( isbuttonregx.test(imgalt) ) {
imgobj.onclick = loadpic;
imgobj.style.cursor = 'pointer';
}
}
}
}
function loadpic() {
var btnsrc = this.src;
var btnalt = this.alt;
var pictoload = btnsrc.replace(btnextension,"");
objimage.src = pictoload;
if (objlink) {
var curhrefdir = GrabDir(objlink.href);
if (curhrefdir) {
var newpage = GrabFile(pictoload);
newpage = GrabFront(".",newpage);
if (newpage) {
var newhref = curhrefdir + newpage + ".html";
objlink.href = newhref;
for (var i = 0 ; i < objlinkadditional.length ; i++) {
objlinkadditional[i].href = newhref;
}
}
}
}
// add altsep to btnalt so that Grabfront does not return null
// when there is no caption2
btnalt = btnalt + altsep;
var captiontoload = GrabFront(altsep,btnalt);
captiontoload = captiontoload.replace(isbuttonregx,"");
var captiontoload2 = GrabAfter(altsep, btnalt);
// remove possible trailing ...
captiontoload2 = captiontoload2.replace(altsep,"");
// replace ... with nicer " - " for picimage alt
btnalt = btnalt.replace(altsep," - ");
// remove the prequel defining button tag
btnalt = btnalt.replace(isbuttonregx,"");
objimage.alt = btnalt;
if (objcaption) {
objcaption.innerHTML = captiontoload;
}
for (var i = 0 ; i < objcapadditional.length ; i++) {
objcapadditional[i].innerHTML = captiontoload;
}
if (objcaption2) {
objcaption2.innerHTML = captiontoload2;
}
for (var i = 0 ; i < objcapadditional2.length ; i++) {
objcapadditional2[i].innerHTML = captiontoload2;
}
// set to not close up in case we have a closeup thing running
iscloseup = false;
clupSetText();
}
function GrabDir(instring) {
var tmp;
var ndx = instring.lastIndexOf("/");
if (ndx == -1) {
return "";
}
return instring.substring(0,ndx+1);
}
function GrabFile(instring) {
var tmp;
var ndx = instring.lastIndexOf("/");
if (ndx == -1) {
return "";
}
return instring.substring(ndx+1);
}
function GrabFront (stag, instring) {
if (instring == "") {
return "";
}
if (stag == "") {
return "";
}
var tagwhere = instring.indexOf(stag);
if (tagwhere <= 0) {
return "";
}
return instring.substring(0, tagwhere);
}
function GrabAfter (stag, instring) {
if (instring == "") {
return "";
}
if (stag == "") {
return "";
}
var tagwhere = instring.indexOf(stag);
if (tagwhere <= 0) {
return "";
}
return instring.substring(tagwhere+stag.length);
}
2) Button images have a name that is same as larger image with _b added
3) In the alt of the button anything following the .. is used as the caption.
In the above four example all will work since the stuff in front of the .. is clipped off
4) A line to load the javascript
5) A noscript section to alert others what they are missing.
Optional:
1) id="piccaption" this will update with the caption from the current button clicked. It is required that
button alt have ".." somewhere in it, but there is no requirement for a piccaption
1b) name="piccaption" this functions the same as the id, but allows for the inclusion of more than 1.
2) id="piccaption2" you can have a second string that is updated.
The alt in the button will have a form such as "..caption 1 text...caption 2 text"
2b) name="piccaption2" same as above.
3) id="piclink" this updates the link with a page given by button.
if button graphic is "myname01_b.jpg" then href = dirFromPreviousHref + myname01 + ".html"
3b) name="piclink"
*/
// this is same as putting in doc
window.onload = init;
var isbuttonregx = /^.*\.\./;
var altsep = "...";
var picimageID = "picimage";
var piccaptionID = "piccaption";
var piccaption2ID = "piccaption2";
var piclinkID = "piclink";
var closeupID = "closeupctrl";
var btnextension = "_b";
var clupextension = "-closeup";
var objimage = null;
var objcaption = null;
var objcaption2 = null;
var objlink = null;
var objcloseup = null;
var objcapadditional = null;
var objcapadditional2 = null;
var objlinkadditional = null;
var iscloseup = false;
var objcloseuptext = null;
var objcloseuptextalt = "Click to restore";
function init() {
initbtns();
initcloseup();
}
function initcloseup() {
if (!(objimage)) {
// discontinue setup there is no master image on this page.
return;
}
objcloseup = document.getElementById(closeupID);
if (!(objcloseup)) {
return;
}
objcloseup.onclick = clupProc;
objcloseup.style.cursor = 'pointer';
objcloseuptext = objcloseup.innerHTML;
}
function clupProc() {
if (iscloseup) {
clupUndo();
} else {
clupDo();
}
clupSetText();
}
function clupDo() {
iscloseup = true;
var pictoload = objimage.src;
pictoload = pictoload.replace(".jpg",clupextension + ".jpg");
objimage.src = pictoload;
}
function clupUndo() {
iscloseup = false;
var pictoload = objimage.src;
pictoload = pictoload.replace(clupextension + ".jpg",".jpg");
objimage.src = pictoload;
}
function clupSetText() {
if (!(objcloseup)) {
return;
}
if (iscloseup) {
objcloseup.innerHTML = objcloseuptextalt;
} else {
objcloseup.innerHTML = objcloseuptext;
}
}
function initbtns() {
objimage = document.getElementById(picimageID);
objlink = document.getElementById(piclinkID);
objlinkadditional = document.getElementsByName(piclinkID);
if (!(objimage)) {
// discontinue setup there is no master image on this page.
return;
}
objcaption = document.getElementById(piccaptionID);
objcaption2 = document.getElementById(piccaption2ID);
objcapadditional = document.getElementsByName(piccaptionID);
objcapadditional2 = document.getElementsByName(piccaption2ID);
for (var i = 0 ; i < document.images.length; i++) {
var imgobj = document.images[i];
var imgsrc = imgobj.src;
var imgalt = imgobj.alt;
var isbutton = (imgsrc.indexOf(btnextension) > -1)? true: false;
if (isbutton) {
if ( isbuttonregx.test(imgalt) ) {
imgobj.onclick = loadpic;
imgobj.style.cursor = 'pointer';
}
}
}
}
function loadpic() {
var btnsrc = this.src;
var btnalt = this.alt;
var pictoload = btnsrc.replace(btnextension,"");
objimage.src = pictoload;
if (objlink) {
var curhrefdir = GrabDir(objlink.href);
if (curhrefdir) {
var newpage = GrabFile(pictoload);
newpage = GrabFront(".",newpage);
if (newpage) {
var newhref = curhrefdir + newpage + ".html";
objlink.href = newhref;
for (var i = 0 ; i < objlinkadditional.length ; i++) {
objlinkadditional[i].href = newhref;
}
}
}
}
// add altsep to btnalt so that Grabfront does not return null
// when there is no caption2
btnalt = btnalt + altsep;
var captiontoload = GrabFront(altsep,btnalt);
captiontoload = captiontoload.replace(isbuttonregx,"");
var captiontoload2 = GrabAfter(altsep, btnalt);
// remove possible trailing ...
captiontoload2 = captiontoload2.replace(altsep,"");
// replace ... with nicer " - " for picimage alt
btnalt = btnalt.replace(altsep," - ");
// remove the prequel defining button tag
btnalt = btnalt.replace(isbuttonregx,"");
objimage.alt = btnalt;
if (objcaption) {
objcaption.innerHTML = captiontoload;
}
for (var i = 0 ; i < objcapadditional.length ; i++) {
objcapadditional[i].innerHTML = captiontoload;
}
if (objcaption2) {
objcaption2.innerHTML = captiontoload2;
}
for (var i = 0 ; i < objcapadditional2.length ; i++) {
objcapadditional2[i].innerHTML = captiontoload2;
}
// set to not close up in case we have a closeup thing running
iscloseup = false;
clupSetText();
}
function GrabDir(instring) {
var tmp;
var ndx = instring.lastIndexOf("/");
if (ndx == -1) {
return "";
}
return instring.substring(0,ndx+1);
}
function GrabFile(instring) {
var tmp;
var ndx = instring.lastIndexOf("/");
if (ndx == -1) {
return "";
}
return instring.substring(ndx+1);
}
function GrabFront (stag, instring) {
if (instring == "") {
return "";
}
if (stag == "") {
return "";
}
var tagwhere = instring.indexOf(stag);
if (tagwhere <= 0) {
return "";
}
return instring.substring(0, tagwhere);
}
function GrabAfter (stag, instring) {
if (instring == "") {
return "";
}
if (stag == "") {
return "";
}
var tagwhere = instring.indexOf(stag);
if (tagwhere <= 0) {
return "";
}
return instring.substring(tagwhere+stag.length);
}