JSLint take 2, reoder function reorder
This commit is contained in:
parent
82e0f3896f
commit
e167b2d7b9
663
js/pear.js
663
js/pear.js
@ -1,85 +1,34 @@
|
|||||||
/*jslint browser: true, regexp: true, sub: false, vars: false, white: false, nomen: false, sloppy: true, undef: true, plusplus: true */
|
/*jslint browser: true, regexp: true, sub: false, vars: false, white: false, nomen: false, sloppy: true, undef: false, plusplus: true */
|
||||||
/*global jQuery, $ */
|
/*global jQuery, $, Event, refresh, escape, unescape, slideshowImages, ImageFlow */
|
||||||
|
|
||||||
var viewMode = "";
|
var viewMode = "";
|
||||||
var skimimg = 0;
|
var skimimg = 0;
|
||||||
var hash = "";
|
|
||||||
var bgcolor = "black";
|
var bgcolor = "black";
|
||||||
var detailViewMode = false;
|
var detailViewMode = false;
|
||||||
var savedHeight = 0;
|
var savedHeight = 0;
|
||||||
var savedWidth = 0;
|
var savedWidth = 0;
|
||||||
|
var iRatio = 0, iWidth = 0, iHeight = 0;
|
||||||
|
var currentImg = 0;
|
||||||
|
var mosaicView = false;
|
||||||
|
var slideShowMode = false;
|
||||||
|
var slideShow = null;
|
||||||
|
var slideShowId;
|
||||||
|
var pearCarousel;
|
||||||
|
var hideHoverV = null;
|
||||||
|
var hovering = false;
|
||||||
|
var maxSize;
|
||||||
|
|
||||||
$(window).resize(function () {
|
function thumbPadding() {
|
||||||
if (window.innerHeight === savedHeight && window.innerWidth === savedWidth) { return; }
|
var size, width, margin;
|
||||||
savedHeight = window.innerHeight;
|
/* Padding on thumbs to make them flow nicer */
|
||||||
savedWidth = window.innerWidth;
|
size = Math.ceil((mosaicView) ? $('#imgSlider').slider('value') / 2 : $('#imgSlider').slider('value')) + 10;
|
||||||
mosaicResize();
|
width = $('#mosaicGridContainer').innerWidth() - 15;
|
||||||
});
|
margin = width / Math.floor(width / size) - size;
|
||||||
|
// console.log(size, width, margin, "px");
|
||||||
|
$('.gallery-thumb').css({'margin-left': Math.ceil(margin / 2) + 'px', 'margin-right': Math.floor(margin / 2) + 'px'});
|
||||||
|
|
||||||
function swatchSkin(intSkin) {
|
|
||||||
setCookie('swatchSkin', intSkin, 1);
|
|
||||||
$('#black').removeClass().addClass("swatch");
|
|
||||||
$('#dkgrey').removeClass().addClass("swatch");
|
|
||||||
$('#ltgrey').removeClass().addClass("swatch");
|
|
||||||
$('#white').removeClass().addClass("swatch");
|
|
||||||
switch (intSkin) {
|
|
||||||
// dkgrey
|
|
||||||
case 'dkgrey':
|
|
||||||
case 1:
|
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition', "-200px 0px");
|
|
||||||
$('#mosaicTable,.pear').css('backgroundColor', "#262626");
|
|
||||||
$('p.giTitle').css("color", "#a9a9a9");
|
|
||||||
$("#dkgrey").addClass("dkgrey sel dkgrey-with-sel-with-swatch");
|
|
||||||
bgcolor = "dkgrey";
|
|
||||||
break;
|
|
||||||
// ltgrey
|
|
||||||
case 'ltgrey':
|
|
||||||
case 2:
|
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition', "-400px 0px");
|
|
||||||
$('#mosaicTable,.pear').css('backgroundColor', "#d9d9d9");
|
|
||||||
$('p.giTitle').css("color", "#333333");
|
|
||||||
$("#ltgrey").addClass("ltgrey sel ltgrey-with-sel-with-swatch");
|
|
||||||
bgcolor = "ltgrey";
|
|
||||||
break;
|
|
||||||
// white
|
|
||||||
case 'white':
|
|
||||||
case 3:
|
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition', "-600px 0px");
|
|
||||||
$('#mosaicTable,.pear').css('backgroundColor', "#ffffff");
|
|
||||||
$('p.giTitle').css("color", "#444444");
|
|
||||||
$("#white").addClass("white sel white-with-sel-with-swatch");
|
|
||||||
bgcolor = "white";
|
|
||||||
break;
|
|
||||||
// Black is default
|
|
||||||
default:
|
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition', "0px 0px");
|
|
||||||
$('#mosaicTable,.pear').css('backgroundColor', "#000");
|
|
||||||
$('p.giTitle').css("color", "#a3a3a3");
|
|
||||||
$("#black").addClass("black sel black-with-sel-with-swatch");
|
|
||||||
bgcolor = "black";
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
updateHash();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function scaleIt(v, sliding) {
|
|
||||||
//if(maxSize<100)maxSize=150;
|
|
||||||
|
|
||||||
// Remap the 0-1 scale to fit the desired range
|
|
||||||
//v=.26+(v*(1.0-.26));
|
|
||||||
var size = (mosaicView) ? v / 2 : v;
|
|
||||||
|
|
||||||
toggleReflex(true);
|
|
||||||
$(".p-photo").each(function (i) {
|
|
||||||
$(this).attr({height: size + 'px', width: size + 'px'});
|
|
||||||
$(this).css({height: size + 'px', width: size + 'px'});
|
|
||||||
});
|
|
||||||
$(".g-photo").css({width: size + 'px'});
|
|
||||||
if (!mosaicView && !sliding) {
|
|
||||||
toggleReflex(false);
|
|
||||||
}
|
|
||||||
thumbPadding();
|
|
||||||
}
|
|
||||||
function setCookie(c_name, value, expiredays) {
|
function setCookie(c_name, value, expiredays) {
|
||||||
var exdate = new Date();
|
var exdate = new Date();
|
||||||
exdate.setDate(exdate.getDate() + expiredays);
|
exdate.setDate(exdate.getDate() + expiredays);
|
||||||
@ -88,6 +37,7 @@ function setCookie(c_name, value, expiredays) {
|
|||||||
|
|
||||||
function getCookie(c_name) {
|
function getCookie(c_name) {
|
||||||
if (document.cookie.length > 0) {
|
if (document.cookie.length > 0) {
|
||||||
|
var c_start, c_end;
|
||||||
c_start = document.cookie.indexOf(c_name + "=");
|
c_start = document.cookie.indexOf(c_name + "=");
|
||||||
if (c_start !== -1) {
|
if (c_start !== -1) {
|
||||||
c_start = c_start + c_name.length + 1;
|
c_start = c_start + c_name.length + 1;
|
||||||
@ -101,91 +51,6 @@ function getCookie(c_name) {
|
|||||||
return "";
|
return "";
|
||||||
}
|
}
|
||||||
|
|
||||||
function checkCookie() {
|
|
||||||
var co = getCookie('slider');
|
|
||||||
if (co !== null && co !== "") {
|
|
||||||
$('#imgSlider').slider("value", co);
|
|
||||||
}
|
|
||||||
co = getCookie('swatchSkin');
|
|
||||||
if (co !== null && co !== "") {
|
|
||||||
swatchSkin(co);
|
|
||||||
} else {
|
|
||||||
swatchSkin('black');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
var iRatio = 0, iWidth = 0, iHeight = 0;
|
|
||||||
//Set a updating timer so users can't update before the image has appeard..
|
|
||||||
function swatchImg(imageId) {
|
|
||||||
if (imageId < 0 || imageId >= slideshowImages.length) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
currentImg = imageId;
|
|
||||||
|
|
||||||
iWidth = parseFloat(slideshowImages[imageId][2].replace(/,/gi, "."));
|
|
||||||
iHeight = parseFloat(slideshowImages[imageId][3].replace(/,/gi, "."));
|
|
||||||
iRatio = iWidth / iHeight;
|
|
||||||
if (isNaN(iRatio)) {
|
|
||||||
iRatio = 1.3333;
|
|
||||||
}
|
|
||||||
if (mosaicView) {
|
|
||||||
$('#mosaicDetail').hide();
|
|
||||||
$('#imageTitle').html("<h2>" + slideshowImages[imageId][4] + "</h2>");
|
|
||||||
$('#mosaicImg').attr('src', slideshowImages[imageId][0]);
|
|
||||||
$('#mosaicImg').css('cursor', "pointer");
|
|
||||||
$('#mosaicDetail').show("slow");
|
|
||||||
}
|
|
||||||
mosaicResize();
|
|
||||||
|
|
||||||
/* Set controls for hover view. */
|
|
||||||
if (currentImg === 0) {
|
|
||||||
$('#prev_detail').addClass('prev_detail_disabled');
|
|
||||||
$('#prev_detail').removeClass('prev_detail');
|
|
||||||
} else {
|
|
||||||
$('#prev_detail').removeClass('prev_detail_disabled');
|
|
||||||
$('#prev_detail').addClass('prev_detail');
|
|
||||||
}
|
|
||||||
if (currentImg === slideshowImages.length - 1) {
|
|
||||||
$('#next_detail').addClass('next_detail_disabled');
|
|
||||||
$('#next_detail').removeClass('next_detail');
|
|
||||||
} else {
|
|
||||||
$('#next_detail').removeClass('next_detail_disabled');
|
|
||||||
$('#next_detail').addClass('next_detail');
|
|
||||||
}
|
|
||||||
/* Update image and title in focus view */
|
|
||||||
$('#img_detail').attr('src', slideshowImages[currentImg][0]);
|
|
||||||
$('#imageTitleLabel').html("<h2>" + slideshowImages[imageId][4] + "</h2>");
|
|
||||||
if (detailViewMode) {
|
|
||||||
//Image count.
|
|
||||||
$.get(slideshowImages[currentImg][6]);
|
|
||||||
}
|
|
||||||
updateHash();
|
|
||||||
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
|
||||||
}
|
|
||||||
|
|
||||||
function getViewMode() {
|
|
||||||
var vm = detailViewMode ? "detail" : viewMode;
|
|
||||||
if (vm !== '') {
|
|
||||||
vm = "&viewMode=" + vm;
|
|
||||||
}
|
|
||||||
return vm;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateHash() {
|
|
||||||
var img = "";
|
|
||||||
if (currentImg !== 0) {
|
|
||||||
img = "img=" + currentImg;
|
|
||||||
}
|
|
||||||
hash = "#" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
|
||||||
window.location.hash = hash;
|
|
||||||
}
|
|
||||||
|
|
||||||
function getAlbumHash(img) {
|
|
||||||
return "#img=" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
|
||||||
}
|
|
||||||
|
|
||||||
var currentImg = 0;
|
|
||||||
var mosaicView = false;
|
|
||||||
|
|
||||||
function mosaicResize() {
|
function mosaicResize() {
|
||||||
if ($('#mosaicGridContainer').length === 0) {
|
if ($('#mosaicGridContainer').length === 0) {
|
||||||
return; //no element found
|
return; //no element found
|
||||||
@ -249,20 +114,328 @@ function mosaicResize() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function thumbPadding() {
|
$(window).resize(function () {
|
||||||
/* Padding on thumbs to make them flow nicer */
|
if (window.innerHeight === savedHeight && window.innerWidth === savedWidth) { return; }
|
||||||
size = Math.ceil((mosaicView) ? $('#imgSlider').slider('value') / 2 : $('#imgSlider').slider('value')) + 10;
|
savedHeight = window.innerHeight;
|
||||||
width = $('#mosaicGridContainer').innerWidth() - 15;
|
savedWidth = window.innerWidth;
|
||||||
margin = width / Math.floor(width / size) - size;
|
mosaicResize();
|
||||||
console.log(size, width, margin, "px");
|
});
|
||||||
$('.gallery-thumb').css({'margin-left': Math.ceil(margin / 2) + 'px', 'margin-right': Math.floor(margin / 2) + 'px'});
|
|
||||||
|
|
||||||
|
function getViewMode() {
|
||||||
|
var vm = detailViewMode ? "detail" : viewMode;
|
||||||
|
if (vm !== '') {
|
||||||
|
vm = "&viewMode=" + vm;
|
||||||
|
}
|
||||||
|
return vm;
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateHash() {
|
||||||
|
var hash, img = "";
|
||||||
|
if (currentImg !== 0) {
|
||||||
|
img = "img=" + currentImg;
|
||||||
|
}
|
||||||
|
hash = "#" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
||||||
|
window.location.hash = hash;
|
||||||
|
}
|
||||||
|
|
||||||
|
function swatchSkin(intSkin) {
|
||||||
|
setCookie('swatchSkin', intSkin, 1);
|
||||||
|
$('#black').removeClass().addClass("swatch");
|
||||||
|
$('#dkgrey').removeClass().addClass("swatch");
|
||||||
|
$('#ltgrey').removeClass().addClass("swatch");
|
||||||
|
$('#white').removeClass().addClass("swatch");
|
||||||
|
switch (intSkin) {
|
||||||
|
// dkgrey
|
||||||
|
case 'dkgrey':
|
||||||
|
case 1:
|
||||||
|
$('div.gallery-thumb-round').css('backgroundPosition', "-200px 0px");
|
||||||
|
$('#mosaicTable,.pear').css('backgroundColor', "#262626");
|
||||||
|
$('p.giTitle').css("color", "#a9a9a9");
|
||||||
|
$("#dkgrey").addClass("dkgrey sel dkgrey-with-sel-with-swatch");
|
||||||
|
bgcolor = "dkgrey";
|
||||||
|
break;
|
||||||
|
// ltgrey
|
||||||
|
case 'ltgrey':
|
||||||
|
case 2:
|
||||||
|
$('div.gallery-thumb-round').css('backgroundPosition', "-400px 0px");
|
||||||
|
$('#mosaicTable,.pear').css('backgroundColor', "#d9d9d9");
|
||||||
|
$('p.giTitle').css("color", "#333333");
|
||||||
|
$("#ltgrey").addClass("ltgrey sel ltgrey-with-sel-with-swatch");
|
||||||
|
bgcolor = "ltgrey";
|
||||||
|
break;
|
||||||
|
// white
|
||||||
|
case 'white':
|
||||||
|
case 3:
|
||||||
|
$('div.gallery-thumb-round').css('backgroundPosition', "-600px 0px");
|
||||||
|
$('#mosaicTable,.pear').css('backgroundColor', "#ffffff");
|
||||||
|
$('p.giTitle').css("color", "#444444");
|
||||||
|
$("#white").addClass("white sel white-with-sel-with-swatch");
|
||||||
|
bgcolor = "white";
|
||||||
|
break;
|
||||||
|
// Black is default
|
||||||
|
default:
|
||||||
|
$('div.gallery-thumb-round').css('backgroundPosition', "0px 0px");
|
||||||
|
$('#mosaicTable,.pear').css('backgroundColor', "#000");
|
||||||
|
$('p.giTitle').css("color", "#a3a3a3");
|
||||||
|
$("#black").addClass("black sel black-with-sel-with-swatch");
|
||||||
|
bgcolor = "black";
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
updateHash();
|
||||||
|
}
|
||||||
|
|
||||||
|
//Set a updating timer so users can't update before the image has appeard..
|
||||||
|
function swatchImg(imageId) {
|
||||||
|
if (imageId < 0 || imageId >= slideshowImages.length) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
currentImg = imageId;
|
||||||
|
|
||||||
|
iWidth = parseFloat(slideshowImages[imageId][2].replace(/,/gi, "."));
|
||||||
|
iHeight = parseFloat(slideshowImages[imageId][3].replace(/,/gi, "."));
|
||||||
|
iRatio = iWidth / iHeight;
|
||||||
|
if (isNaN(iRatio)) {
|
||||||
|
iRatio = 1.3333;
|
||||||
|
}
|
||||||
|
if (mosaicView) {
|
||||||
|
$('#mosaicDetail').hide();
|
||||||
|
$('#imageTitle').html("<h2>" + slideshowImages[imageId][4] + "</h2>");
|
||||||
|
$('#mosaicImg').attr('src', slideshowImages[imageId][0]);
|
||||||
|
$('#mosaicImg').css('cursor', "pointer");
|
||||||
|
$('#mosaicDetail').show("slow");
|
||||||
|
}
|
||||||
|
mosaicResize();
|
||||||
|
|
||||||
|
/* Set controls for hover view. */
|
||||||
|
if (currentImg === 0) {
|
||||||
|
$('#prev_detail').addClass('prev_detail_disabled');
|
||||||
|
$('#prev_detail').removeClass('prev_detail');
|
||||||
|
} else {
|
||||||
|
$('#prev_detail').removeClass('prev_detail_disabled');
|
||||||
|
$('#prev_detail').addClass('prev_detail');
|
||||||
|
}
|
||||||
|
if (currentImg === slideshowImages.length - 1) {
|
||||||
|
$('#next_detail').addClass('next_detail_disabled');
|
||||||
|
$('#next_detail').removeClass('next_detail');
|
||||||
|
} else {
|
||||||
|
$('#next_detail').removeClass('next_detail_disabled');
|
||||||
|
$('#next_detail').addClass('next_detail');
|
||||||
|
}
|
||||||
|
/* Update image and title in focus view */
|
||||||
|
$('#img_detail').attr('src', slideshowImages[currentImg][0]);
|
||||||
|
$('#imageTitleLabel').html("<h2>" + slideshowImages[imageId][4] + "</h2>");
|
||||||
|
if (detailViewMode) {
|
||||||
|
//Image count.
|
||||||
|
$.get(slideshowImages[currentImg][6]);
|
||||||
|
}
|
||||||
|
updateHash();
|
||||||
|
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
||||||
|
}
|
||||||
|
|
||||||
|
function hideHoverView() {
|
||||||
|
if (!hovering) { $('#hoverView').fadeOut(); }
|
||||||
|
hideHoverV = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function showHoverView() {
|
||||||
|
if (hideHoverV !== null) { clearTimeout(hideHoverV); }
|
||||||
|
$('#hoverView').show();
|
||||||
|
hideHoverV = setTimeout(hideHoverView(), 3000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function focusImage(id, redirected) {
|
||||||
|
currentImg = id;
|
||||||
|
$('#imageTitleLabel').html("<h2>" + slideshowImages[id][4] + "</h2>");
|
||||||
|
$('#play_detail').hide();
|
||||||
|
$('#pause_detail').hide();
|
||||||
|
swatchImg(id);
|
||||||
|
$('#detailView').fadeIn('slow');
|
||||||
|
hideHoverV = setTimeout(hideHoverView(), 3000);
|
||||||
|
detailViewMode = true;
|
||||||
|
updateHash();
|
||||||
|
//Image count.
|
||||||
|
if (!redirected) { $.get(slideshowImages[currentImg][6]); }
|
||||||
|
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleReflex(hide) {
|
||||||
|
if (hide) {
|
||||||
|
// $$('.Fer').each(function(s) { cvi_reflex.remove(s); });
|
||||||
|
$('mosaicGridContainer').select('img[class="Fer"]').each(function (s, index) { Event.observe(s, 'click', function () { if (mosaicView) { swatchImg(index); } else { focusImage(index); } }); });
|
||||||
|
} else {
|
||||||
|
// $$('.Fer').each(function(s) { cvi_reflex.add(s, {height: 20, distance: 0 }); });
|
||||||
|
$('mosaicGridContainer').select('canvas[class="Fer"]').each(function (s, index) { Event.observe(s, 'click', function () { if (mosaicView) { swatchImg(index); } else { focusImage(index); } }); });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function scaleIt(v, sliding) {
|
||||||
|
//if(maxSize<100)maxSize=150;
|
||||||
|
|
||||||
|
// Remap the 0-1 scale to fit the desired range
|
||||||
|
//v=.26+(v*(1.0-.26));
|
||||||
|
var size = (mosaicView) ? v / 2 : v;
|
||||||
|
|
||||||
|
toggleReflex(true);
|
||||||
|
$(".p-photo").each(function (i) {
|
||||||
|
$(this).attr({height: size + 'px', width: size + 'px'});
|
||||||
|
$(this).css({height: size + 'px', width: size + 'px'});
|
||||||
|
});
|
||||||
|
$(".g-photo").css({width: size + 'px'});
|
||||||
|
if (!mosaicView && !sliding) {
|
||||||
|
toggleReflex(false);
|
||||||
|
}
|
||||||
|
thumbPadding();
|
||||||
|
}
|
||||||
|
|
||||||
|
function checkCookie() {
|
||||||
|
var co = getCookie('slider');
|
||||||
|
if (co !== null && co !== "") {
|
||||||
|
$('#imgSlider').slider("value", co);
|
||||||
|
}
|
||||||
|
co = getCookie('swatchSkin');
|
||||||
|
if (co !== null && co !== "") {
|
||||||
|
swatchSkin(co);
|
||||||
|
} else {
|
||||||
|
swatchSkin('black');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function getAlbumHash(img) {
|
||||||
|
return "#img=" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
||||||
|
}
|
||||||
|
|
||||||
|
function togglePlayPause() {
|
||||||
|
//We are paused
|
||||||
|
if (slideShow === null) {
|
||||||
|
$('#play_detail').hide();
|
||||||
|
$('#pause_detail').show();
|
||||||
|
slideShow = setTimeout("slideShowUpdate(" + (slideShowId + 1) + ")", 1000);
|
||||||
|
} else { //We are playing
|
||||||
|
$('#pause_detail').hide();
|
||||||
|
$('#play_detail').show();
|
||||||
|
clearTimeout(slideShow);
|
||||||
|
slideShow = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function startSlideshow() {
|
||||||
|
slideShowMode = true;
|
||||||
|
$('#play_detail').hide();
|
||||||
|
$('#pause_detail').show();
|
||||||
|
$('#detailView').fadeIn('slow');
|
||||||
|
hideHoverV = setTimeout(hideHoverView(), 3000);
|
||||||
|
slideShowId = currentImg;
|
||||||
|
slideShowId = 0;
|
||||||
|
togglePlayPause();
|
||||||
|
}
|
||||||
|
|
||||||
|
function slideShowUpdate(id) {
|
||||||
|
if (id > slideshowImages.length) {
|
||||||
|
id = 0;
|
||||||
|
}
|
||||||
|
swatchImg(id);
|
||||||
|
slideShow = setTimeout(slideShowUpdate(id + 1), 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchMode(mode) {
|
||||||
|
$('#mosaic,#grid,#carousel').removeClass("sel sel-with-viewSwitcher");
|
||||||
|
$('#' + mode).addClass("sel sel-with-viewSwitcher");
|
||||||
|
updateHash();
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchToGrid(userSet) {
|
||||||
|
if (userSet === true) {
|
||||||
|
viewMode = "grid";
|
||||||
|
}
|
||||||
|
toggleReflex(true);
|
||||||
|
$('#pearImageFlow,#pearFlowPadd').hide();
|
||||||
|
$('#mosaicTable').show();
|
||||||
|
if (!$('#mosaicGridContainer').length) { return; }
|
||||||
|
mosaicView = false;
|
||||||
|
maxSize = 225;
|
||||||
|
checkCookie();
|
||||||
|
$('#mosaicDetail').hide();
|
||||||
|
$('#mosaicGridContainer').show();
|
||||||
|
$('p.giTitle,div.giInfo').each(function (s) { $(this).show(); });
|
||||||
|
switchMode('grid');
|
||||||
|
mosaicResize();
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchToMosaic(userSet) {
|
||||||
|
if (userSet === true) {
|
||||||
|
viewMode = "mosaic";
|
||||||
|
}
|
||||||
|
toggleReflex(false);
|
||||||
|
$('#pearImageFlow,#pearFlowPadd').hide();
|
||||||
|
$('#mosaicTable').show();
|
||||||
|
if (!$('#mosaicGridContainer').length) { return; }
|
||||||
|
mosaicView = true;
|
||||||
|
maxSize = 125;
|
||||||
|
checkCookie();
|
||||||
|
$('#mosaicDetail').show();
|
||||||
|
$('#mosaicGridContainer').show();
|
||||||
|
$('p.giTitle,div.giInfo').each(function (s) { $(this).hide(); });
|
||||||
|
switchMode('mosaic');
|
||||||
|
swatchImg(currentImg);
|
||||||
|
mosaicResize();
|
||||||
|
}
|
||||||
|
|
||||||
|
function startImageFlow(userSet) {
|
||||||
|
var i, img;
|
||||||
|
if (userSet === true) {
|
||||||
|
viewMode = "carousel";
|
||||||
|
}
|
||||||
|
$('#mosaicTable').hide();
|
||||||
|
|
||||||
|
$('#pearImageFlow,#pearFlowPadd').show();
|
||||||
|
|
||||||
|
toggleReflex(true);
|
||||||
|
|
||||||
|
if (!pearCarousel) {
|
||||||
|
for (i = 0; i < slideshowImages.length; i++) {
|
||||||
|
//var img = '<div class="item"><img class="content" src="' + slideshowImages[i][0] + '"/><div class="caption">' + $('#mosaicGridContainer img').eq(i).attr('alt') + '"</div></div>';
|
||||||
|
img = '<img src="' + slideshowImages[i][0] + '" longdesc="' + i + '" width="' + slideshowImages[i][2] + '" height="' + slideshowImages[i][3] + '" alt="' + slideshowImages[i][4] + '" style="display: none;">';
|
||||||
|
// console.log(img);
|
||||||
|
$('#pearImageFlow').append(img);
|
||||||
|
}
|
||||||
|
pearCarousel = new ImageFlow();
|
||||||
|
pearCarousel.init({ImageFlowID: 'pearImageFlow', aspectRatio: 2.4, imagesHeight: 0.6, opacity: true, reflections: false, startID: currentImg + 1, onClick: function () { focusImage($(this).attr('longdesc')); }, startAnimation: true, xStep: 200, imageFocusM: 1.7, imageFocusMax: 4, opacityArray: [10, 9, 6, 2], percentOther: 130, captions: false, slider: false});
|
||||||
|
}
|
||||||
|
switchMode('carousel');
|
||||||
|
mosaicResize();
|
||||||
|
}
|
||||||
|
|
||||||
|
function setKeys() {
|
||||||
|
/* Fixes the back button issue */
|
||||||
|
/* window.onunload = function()
|
||||||
|
{
|
||||||
|
document = null;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
$(document).keydown(function (e) {
|
||||||
|
var charCode = e.keyCode || e.which;
|
||||||
|
switch (charCode) {
|
||||||
|
case 32: /* Space */
|
||||||
|
if (slideShowMode) { togglePlayPause(); }
|
||||||
|
break;
|
||||||
|
case 39: /* Right arrow key */
|
||||||
|
case 78: /* N */
|
||||||
|
swatchImg(currentImg + 1);
|
||||||
|
// if($('imageflow')) handle(-1);
|
||||||
|
break;
|
||||||
|
case 80: /* P */
|
||||||
|
case 37: /* Left arrow key */
|
||||||
|
swatchImg(currentImg - 1);
|
||||||
|
// if($('imageflow')) handle(1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function bodyLoad(vm, bgcolor) {
|
function bodyLoad(vm, bgcolor) {
|
||||||
|
var h, co;
|
||||||
/* Parse hash */
|
/* Parse hash */
|
||||||
hash = window.location.hash;
|
h = $.parseQuery(window.location.hash.substring(1));
|
||||||
var h = $.parseQuery(hash.substring(1));
|
|
||||||
if (h.img !== undefined) {
|
if (h.img !== undefined) {
|
||||||
currentImg = parseInt(h.img, 10);
|
currentImg = parseInt(h.img, 10);
|
||||||
}
|
}
|
||||||
@ -323,172 +496,12 @@ function bodyLoad(vm, bgcolor) {
|
|||||||
setKeys();
|
setKeys();
|
||||||
}
|
}
|
||||||
|
|
||||||
function switchToGrid(userSet) {
|
|
||||||
if (userSet === true) {
|
|
||||||
viewMode = "grid";
|
|
||||||
}
|
|
||||||
toggleReflex(true);
|
|
||||||
$('#pearImageFlow,#pearFlowPadd').hide();
|
|
||||||
$('#mosaicTable').show();
|
|
||||||
if (!$('#mosaicGridContainer').length) { return; }
|
|
||||||
mosaicView = false;
|
|
||||||
maxSize = 225;
|
|
||||||
checkCookie();
|
|
||||||
$('#mosaicDetail').hide();
|
|
||||||
$('#mosaicGridContainer').show();
|
|
||||||
$('p.giTitle,div.giInfo').each(function (s) { $(this).show(); });
|
|
||||||
switchMode('grid');
|
|
||||||
mosaicResize();
|
|
||||||
}
|
|
||||||
|
|
||||||
function switchToMosaic(userSet) {
|
|
||||||
if (userSet === true) {
|
|
||||||
viewMode = "mosaic";
|
|
||||||
}
|
|
||||||
toggleReflex(false);
|
|
||||||
$('#pearImageFlow,#pearFlowPadd').hide();
|
|
||||||
$('#mosaicTable').show();
|
|
||||||
if (!$('#mosaicGridContainer').length) { return; }
|
|
||||||
mosaicView = true;
|
|
||||||
maxSize = 125;
|
|
||||||
checkCookie();
|
|
||||||
$('#mosaicDetail').show();
|
|
||||||
$('#mosaicGridContainer').show();
|
|
||||||
$('p.giTitle,div.giInfo').each(function (s) { $(this).hide(); });
|
|
||||||
switchMode('mosaic');
|
|
||||||
swatchImg(currentImg);
|
|
||||||
mosaicResize();
|
|
||||||
}
|
|
||||||
var slideShowMode = false;
|
|
||||||
function startSlideshow() {
|
|
||||||
slideShowMode = true;
|
|
||||||
$('#play_detail').hide();
|
|
||||||
$('#pause_detail').show();
|
|
||||||
$('#detailView').fadeIn('slow');
|
|
||||||
hideHoverV = setTimeout(hideHoverView(), 3000);
|
|
||||||
slideShowId = currentImg;
|
|
||||||
slideShowId = 0;
|
|
||||||
togglePlayPause();
|
|
||||||
}
|
|
||||||
var slideShow = null;
|
|
||||||
var slideShowId;
|
|
||||||
function slideShowUpdate(id) {
|
|
||||||
if (id > slideshowImages.length) {
|
|
||||||
id = 0;
|
|
||||||
}
|
|
||||||
swatchImg(id);
|
|
||||||
slideShow = setTimeout("slideShowUpdate(" + (id + 1) + ")", 1000);
|
|
||||||
}
|
|
||||||
function togglePlayPause() {
|
|
||||||
//We are paused
|
|
||||||
if (slideShow === null) {
|
|
||||||
$('#play_detail').hide();
|
|
||||||
$('#pause_detail').show();
|
|
||||||
slideShow = setTimeout("slideShowUpdate(" + (slideShowId + 1) + ")", 1000);
|
|
||||||
} else { //We are playing
|
|
||||||
$('#pause_detail').hide();
|
|
||||||
$('#play_detail').show();
|
|
||||||
clearTimeout(slideShow);
|
|
||||||
slideShow = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function focusImage(id, redirected) {
|
|
||||||
currentImg = id;
|
|
||||||
$('#imageTitleLabel').html("<h2>" + slideshowImages[id][4] + "</h2>");
|
|
||||||
$('#play_detail').hide();
|
|
||||||
$('#pause_detail').hide();
|
|
||||||
swatchImg(id);
|
|
||||||
$('#detailView').fadeIn('slow');
|
|
||||||
hideHoverV = setTimeout(hideHoverView(), 3000);
|
|
||||||
detailViewMode = true;
|
|
||||||
updateHash();
|
|
||||||
//Image count.
|
|
||||||
if (!redirected) { $.get(slideshowImages[currentImg][6]); }
|
|
||||||
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
|
||||||
}
|
|
||||||
var pearCarousel;
|
|
||||||
function startImageFlow(userSet) {
|
|
||||||
if (userSet === true) {
|
|
||||||
viewMode = "carousel";
|
|
||||||
}
|
|
||||||
$('#mosaicTable').hide();
|
|
||||||
|
|
||||||
$('#pearImageFlow,#pearFlowPadd').show();
|
|
||||||
|
|
||||||
toggleReflex(true);
|
|
||||||
|
|
||||||
if (!pearCarousel) {
|
|
||||||
for (i = 0; i < slideshowImages.length; i++) {
|
|
||||||
//var img = '<div class="item"><img class="content" src="' + slideshowImages[i][0] + '"/><div class="caption">' + $('#mosaicGridContainer img').eq(i).attr('alt') + '"</div></div>';
|
|
||||||
var img = '<img src="' + slideshowImages[i][0] + '" longdesc="' + i + '" width="' + slideshowImages[i][2] + '" height="' + slideshowImages[i][3] + '" alt="' + slideshowImages[i][4] + '" style="display: none;">';
|
|
||||||
// console.log(img);
|
|
||||||
$('#pearImageFlow').append(img);
|
|
||||||
}
|
|
||||||
pearCarousel = new ImageFlow();
|
|
||||||
pearCarousel.init({ImageFlowID: 'pearImageFlow', aspectRatio: 2.4, imagesHeight: 0.6, opacity: true, reflections: false, startID: currentImg + 1, onClick: function () { focusImage($(this).attr('longdesc')); }, startAnimation: true, xStep: 200, imageFocusM: 1.7, imageFocusMax: 4, opacityArray: [10, 9, 6, 2], percentOther: 130, captions: false, slider: false});
|
|
||||||
}
|
|
||||||
switchMode('carousel');
|
|
||||||
mosaicResize();
|
|
||||||
}
|
|
||||||
function setKeys() {
|
|
||||||
/* Fixes the back button issue */
|
|
||||||
/* window.onunload = function()
|
|
||||||
{
|
|
||||||
document = null;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
$(document).keydown(function (e) {
|
|
||||||
var charCode = e.keyCode || e.which;
|
|
||||||
switch (charCode) {
|
|
||||||
case 32: /* Space */
|
|
||||||
if (slideShowMode) { togglePlayPause(); }
|
|
||||||
break;
|
|
||||||
case 39: /* Right arrow key */
|
|
||||||
case 78: /* N */
|
|
||||||
swatchImg(currentImg + 1);
|
|
||||||
// if($('imageflow')) handle(-1);
|
|
||||||
break;
|
|
||||||
case 80: /* P */
|
|
||||||
case 37: /* Left arrow key */
|
|
||||||
swatchImg(currentImg - 1);
|
|
||||||
// if($('imageflow')) handle(1);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
function showHoverView() {
|
|
||||||
if (hideHoverV !== null) { clearTimeout(hideHoverV); }
|
|
||||||
$('#hoverView').show();
|
|
||||||
hideHoverV = setTimeout(hideHoverView(), 3000);
|
|
||||||
}
|
|
||||||
function hideHoverView() {
|
|
||||||
if (!hovering) { $('#hoverView').fadeOut(); }
|
|
||||||
hideHoverV = null;
|
|
||||||
}
|
|
||||||
var hideHoverV = null;
|
|
||||||
var hovering = false;
|
|
||||||
function switchMode(mode) {
|
|
||||||
$('#mosaic,#grid,#carousel').removeClass("sel sel-with-viewSwitcher");
|
|
||||||
$('#' + mode).addClass("sel sel-with-viewSwitcher");
|
|
||||||
updateHash();
|
|
||||||
}
|
|
||||||
|
|
||||||
function preFetch() {
|
function preFetch() {
|
||||||
/* for (var i = 0; i < slideshowImages.length; i++) {
|
/* for (var i = 0; i < slideshowImages.length; i++) {
|
||||||
var tempImage = new Element('img', {'src': slideshowImages[i][0]});
|
var tempImage = new Element('img', {'src': slideshowImages[i][0]});
|
||||||
}*/
|
}*/
|
||||||
}
|
}
|
||||||
|
|
||||||
function toggleReflex(hide) {
|
|
||||||
if (hide) {
|
|
||||||
// $$('.Fer').each(function(s) { cvi_reflex.remove(s); });
|
|
||||||
$('mosaicGridContainer').select('img[class="Fer"]').each(function (s, index) { Event.observe(s, 'click', function () { if (mosaicView) { swatchImg(index); } else { focusImage(index); } }); });
|
|
||||||
} else {
|
|
||||||
// $$('.Fer').each(function(s) { cvi_reflex.add(s, {height: 20, distance: 0 }); });
|
|
||||||
$('mosaicGridContainer').select('canvas[class="Fer"]').each(function (s, index) { Event.observe(s, 'click', function () { if (mosaicView) { swatchImg(index); } else { focusImage(index); } }); });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideDetailView() {
|
function hideDetailView() {
|
||||||
$('#detailView').hide();
|
$('#detailView').hide();
|
||||||
slideShowMode = detailViewMode = false;
|
slideShowMode = detailViewMode = false;
|
||||||
|
Reference in New Issue
Block a user