Merge pull request #90 from fredrike/master
Updated version of the theme .pear.
This commit is contained in:
commit
f88898322e
@ -87,7 +87,7 @@ class Admin_Theme_Options_Controller extends Admin_Controller {
|
|||||||
->checked(module::get_var("th_pear4gallery3", "hide_logo"));
|
->checked(module::get_var("th_pear4gallery3", "hide_logo"));
|
||||||
$group->dropdown("mainmenu_view")
|
$group->dropdown("mainmenu_view")
|
||||||
->label(t("Main page View"))
|
->label(t("Main page View"))
|
||||||
->options(array("grid" => t("Grid (Default)"), "mosaic" => t("Mosaic")))
|
->options(array("grid" => t("Grid (Default)"), "mosaic" => t("Mosaic"), "carousel" => t("Carousel")))
|
||||||
->selected(module::get_var("th_pear4gallery3", "mainmenu_view"));
|
->selected(module::get_var("th_pear4gallery3", "mainmenu_view"));
|
||||||
$group->checkbox("show_guest_menu")
|
$group->checkbox("show_guest_menu")
|
||||||
->label(t("Show Main Menu for Guest Users"))
|
->label(t("Show Main Menu for Guest Users"))
|
||||||
|
@ -1,8 +1,6 @@
|
|||||||
.gallery-thumb {
|
.gallery-thumb {
|
||||||
float: left;
|
float: left;
|
||||||
margin-bottom: 5px;
|
padding: 3px 5px 7px 5px;
|
||||||
margin-left: 5px;
|
|
||||||
margin-right: 5px;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -40,9 +38,11 @@ th, td {
|
|||||||
.giTitle {
|
.giTitle {
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin: 3px 10px !important;
|
margin: 0.3em 3px !important;
|
||||||
padding: 0 0;
|
padding: 0 0;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
height: 1.2em;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#gsNavBar div {
|
#gsNavBar div {
|
||||||
|
BIN
3.0/themes/pear4gallery3/icons/movie.png
Normal file
BIN
3.0/themes/pear4gallery3/icons/movie.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 4.1 KiB |
@ -1,6 +1,17 @@
|
|||||||
.gallery-thumb-round {
|
.gallery-thumb-round {
|
||||||
background: url('rounded.png') no-repeat scroll left top;
|
background: url('rounded.png') no-repeat scroll left top;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
height: 200px;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-video{
|
||||||
|
background: url('movie.png') no-repeat center;
|
||||||
|
position: absolute;
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
left: 0px;
|
||||||
|
top: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.skimm_div {
|
.skimm_div {
|
||||||
@ -59,7 +70,7 @@ height:40px;
|
|||||||
display: block;
|
display: block;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
background: transparent url('pear_logo_sml.png') no-repeat center left;
|
background: transparent url('pear_logo_sml.png') no-repeat center left;
|
||||||
width: 83px;
|
width: 30px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border: 0px;
|
border: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
@ -301,7 +312,7 @@ cursor: default;
|
|||||||
#viewControls {
|
#viewControls {
|
||||||
position: relative;
|
position: relative;
|
||||||
color: #616161;
|
color: #616161;
|
||||||
width: 381px;
|
width: 334px;
|
||||||
float: left;
|
float: left;
|
||||||
margin-left: 30px;
|
margin-left: 30px;
|
||||||
margin-top: 13px;
|
margin-top: 13px;
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
var viewMode="";
|
||||||
var skimimg = 0;
|
var skimimg = 0;
|
||||||
var hash="";
|
var hash="";
|
||||||
var bgcolor="black";
|
var bgcolor="black";
|
||||||
@ -5,9 +6,8 @@ var detailViewMode=false;
|
|||||||
var savedHeight = 0;
|
var savedHeight = 0;
|
||||||
var savedWidth = 0;
|
var savedWidth = 0;
|
||||||
|
|
||||||
$(window).resize(function (e) {
|
$(window).resize(function () {
|
||||||
if (window.innerHeight == savedHeight &&
|
if (window.innerHeight == savedHeight && window.innerWidth == savedWidth) return;
|
||||||
window.innerWidth == savedWidth) { e.stop(); }
|
|
||||||
savedHeight = window.innerHeight;
|
savedHeight = window.innerHeight;
|
||||||
savedWidth = window.innerWidth;
|
savedWidth = window.innerWidth;
|
||||||
mosaicResize();
|
mosaicResize();
|
||||||
@ -24,7 +24,7 @@ function swatchSkin(intSkin){
|
|||||||
case 'dkgrey' :
|
case 'dkgrey' :
|
||||||
case 1 :
|
case 1 :
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition' , "-200px 0px");
|
$('div.gallery-thumb-round').css('backgroundPosition' , "-200px 0px");
|
||||||
$('#mosaicTable').css('backgroundColor' , "#262626");
|
$('#mosaicTable,.pear').css('backgroundColor' , "#262626");
|
||||||
$('p.giTitle').css("color", "#a9a9a9");
|
$('p.giTitle').css("color", "#a9a9a9");
|
||||||
$("#dkgrey").addClass("dkgrey sel dkgrey-with-sel-with-swatch");
|
$("#dkgrey").addClass("dkgrey sel dkgrey-with-sel-with-swatch");
|
||||||
bgcolor="dkgrey";
|
bgcolor="dkgrey";
|
||||||
@ -33,7 +33,7 @@ function swatchSkin(intSkin){
|
|||||||
case 'ltgrey' :
|
case 'ltgrey' :
|
||||||
case 2 :
|
case 2 :
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition' , "-400px 0px");
|
$('div.gallery-thumb-round').css('backgroundPosition' , "-400px 0px");
|
||||||
$('#mosaicTable').css('backgroundColor' , "#d9d9d9");
|
$('#mosaicTable,.pear').css('backgroundColor' , "#d9d9d9");
|
||||||
$('p.giTitle').css("color", "#333333");
|
$('p.giTitle').css("color", "#333333");
|
||||||
$("#ltgrey").addClass("ltgrey sel ltgrey-with-sel-with-swatch");
|
$("#ltgrey").addClass("ltgrey sel ltgrey-with-sel-with-swatch");
|
||||||
bgcolor="ltgrey";
|
bgcolor="ltgrey";
|
||||||
@ -42,7 +42,7 @@ function swatchSkin(intSkin){
|
|||||||
case 'white' :
|
case 'white' :
|
||||||
case 3 :
|
case 3 :
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition' , "-600px 0px");
|
$('div.gallery-thumb-round').css('backgroundPosition' , "-600px 0px");
|
||||||
$('#mosaicTable').css('backgroundColor' , "#ffffff");
|
$('#mosaicTable,.pear').css('backgroundColor' , "#ffffff");
|
||||||
$('p.giTitle').css("color", "#444444");
|
$('p.giTitle').css("color", "#444444");
|
||||||
$("#white").addClass("white sel white-with-sel-with-swatch");
|
$("#white").addClass("white sel white-with-sel-with-swatch");
|
||||||
bgcolor="white";
|
bgcolor="white";
|
||||||
@ -52,7 +52,7 @@ function swatchSkin(intSkin){
|
|||||||
case 0 :
|
case 0 :
|
||||||
default:
|
default:
|
||||||
$('div.gallery-thumb-round').css('backgroundPosition' , "0px 0px");
|
$('div.gallery-thumb-round').css('backgroundPosition' , "0px 0px");
|
||||||
$('#mosaicTable').css('backgroundColor' , "#000");
|
$('#mosaicTable,.pear').css('backgroundColor' , "#000");
|
||||||
$('p.giTitle').css("color", "#a3a3a3");
|
$('p.giTitle').css("color", "#a3a3a3");
|
||||||
$("#black").addClass("black sel black-with-sel-with-swatch");
|
$("#black").addClass("black sel black-with-sel-with-swatch");
|
||||||
bgcolor="black";
|
bgcolor="black";
|
||||||
@ -66,14 +66,16 @@ function scaleIt(v,sliding){
|
|||||||
|
|
||||||
// Remap the 0-1 scale to fit the desired range
|
// Remap the 0-1 scale to fit the desired range
|
||||||
//v=.26+(v*(1.0-.26));
|
//v=.26+(v*(1.0-.26));
|
||||||
size = (mosaicView) ? v/2 : v;
|
var size = (mosaicView) ? v/2 : v;
|
||||||
|
|
||||||
toggleReflex(true);
|
toggleReflex(true);
|
||||||
$(".p-photo").each(function (i) {
|
$(".p-photo").each(function (i) {
|
||||||
$(this).attr({height: size+'px',width: size + 'px'});
|
$(this).attr({height: size+'px',width: size + 'px'});
|
||||||
$(this).css({height: size+'px',width: size+'px'});});
|
$(this).css({height: size+'px',width: size+'px'});});
|
||||||
|
$(".g-photo").css({width: size+'px'});
|
||||||
if(!mosaicView && !sliding)
|
if(!mosaicView && !sliding)
|
||||||
toggleReflex(false);
|
toggleReflex(false);
|
||||||
|
thumbPadding();
|
||||||
}
|
}
|
||||||
function setCookie(c_name,value,expiredays)
|
function setCookie(c_name,value,expiredays)
|
||||||
{
|
{
|
||||||
@ -153,17 +155,24 @@ function swatchImg(imageId)
|
|||||||
updateHash();
|
updateHash();
|
||||||
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
||||||
}
|
}
|
||||||
|
function getViewMode()
|
||||||
|
{
|
||||||
|
var vm = detailViewMode ? "detail" : viewMode;
|
||||||
|
if(vm !== '')
|
||||||
|
vm = "&viewMode=" + vm;
|
||||||
|
return vm;
|
||||||
|
}
|
||||||
function updateHash()
|
function updateHash()
|
||||||
{
|
{
|
||||||
viewMode = detailViewMode ? "detail" : (mosaicView ? "mosaic" : "grid");
|
var img="";
|
||||||
hash = "#img=" + currentImg + "&viewMode=" + viewMode + "&bgcolor=" + bgcolor;
|
if(currentImg !== 0)
|
||||||
|
img = "img=" + currentImg;
|
||||||
|
hash = "#" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
||||||
window.location.hash = hash;
|
window.location.hash = hash;
|
||||||
}
|
}
|
||||||
function getAlbumHash(img)
|
function getAlbumHash(img)
|
||||||
{
|
{
|
||||||
viewMode = detailViewMode ? "detail" : (mosaicView ? "mosaic" : "grid");
|
return "#img=" + img + getViewMode() + "&bgcolor=" + bgcolor;
|
||||||
return "#img=" + img + "&viewMode=" + viewMode + "&bgcolor=" + bgcolor;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
var currentImg=0;
|
var currentImg=0;
|
||||||
@ -186,8 +195,6 @@ function mosaicResize()
|
|||||||
myWidth = document.body.clientWidth;
|
myWidth = document.body.clientWidth;
|
||||||
myHeight = document.body.clientHeight;
|
myHeight = document.body.clientHeight;
|
||||||
}
|
}
|
||||||
if($('#pearImageFlow').length != 0)
|
|
||||||
$('#pearImageFlow').css({'height' : (myHeight-87)+'px', 'width': myWidth+'px', 'minHeight': ((myHeight-70)*0.9)+'px'});
|
|
||||||
if($('#imageflow').length != 0)
|
if($('#imageflow').length != 0)
|
||||||
$('#imageflow').css({'height': (myHeight-53)+'px', 'width': (((myWidth*0.5)<(myHeight-53)) ? myWidth : ((myHeight-65)*2)) +'px'});
|
$('#imageflow').css({'height': (myHeight-53)+'px', 'width': (((myWidth*0.5)<(myHeight-53)) ? myWidth : ((myHeight-65)*2)) +'px'});
|
||||||
$('#detailImageView').css({'height': myHeight-165+"px"});
|
$('#detailImageView').css({'height': myHeight-165+"px"});
|
||||||
@ -196,10 +203,14 @@ function mosaicResize()
|
|||||||
$('#img_detail').css({'height': iHeight+"px", 'width':iWidth+"px"});
|
$('#img_detail').css({'height': iHeight+"px", 'width':iWidth+"px"});
|
||||||
|
|
||||||
myWidth=myWidth-7;
|
myWidth=myWidth-7;
|
||||||
|
myHeight = myHeight - $('#g-site-status').outerHeight(true);
|
||||||
|
$('#pearFlowPadd').css({'height' : myHeight-90-(Math.round(myWidth / 2.4))+'px'});
|
||||||
($('#paginator').length != 0) ? myHeight-=165: myHeight-=138;
|
($('#paginator').length != 0) ? myHeight-=165: myHeight-=138;
|
||||||
myHeight = myHeight - $('#g-site-status').outerHeight(true);
|
myHeight = myHeight - $('#g-site-status').outerHeight(true);
|
||||||
$('#g-header').css('top', $('#gsNavBar').outerHeight(true)+$('#g-site-status').outerHeight(true)-4);
|
$('#g-header').css('top', $('#gsNavBar').outerHeight(true)+$('#g-site-status').outerHeight(true)-4);
|
||||||
|
|
||||||
|
if($('#g-movie').length)
|
||||||
|
myHeight+=18;
|
||||||
if ( !mosaicView )
|
if ( !mosaicView )
|
||||||
{
|
{
|
||||||
$('#mosaicGridContainer').css({'height': (myHeight+33)+"px", 'width': myWidth+"px"});
|
$('#mosaicGridContainer').css({'height': (myHeight+33)+"px", 'width': myWidth+"px"});
|
||||||
@ -214,10 +225,20 @@ function mosaicResize()
|
|||||||
(iRatio>(myWidth/myHeight)) ? $('#mosaicImg').attr({height: myWidth/iRatio,width: myWidth}) : $('#mosaicImg').attr({height: myHeight,width: myHeight*iRatio});
|
(iRatio>(myWidth/myHeight)) ? $('#mosaicImg').attr({height: myWidth/iRatio,width: myWidth}) : $('#mosaicImg').attr({height: myHeight,width: myHeight*iRatio});
|
||||||
if(iHeight<myHeight&&iWidth<myWidth) $('#mosaicImg').attr({height:iHeight, width:iWidth});
|
if(iHeight<myHeight&&iWidth<myWidth) $('#mosaicImg').attr({height:iHeight, width:iWidth});
|
||||||
}
|
}
|
||||||
|
thumbPadding();
|
||||||
|
|
||||||
if($('#conf_imageflow').length) refresh();
|
if($('#conf_imageflow').length) refresh();
|
||||||
}
|
}
|
||||||
|
function thumbPadding() {
|
||||||
|
/* Padding on thumbs to make them flow nicer */
|
||||||
|
var size = Math.ceil((mosaicView) ? $('#imgSlider').slider('value')/2 : $('#imgSlider').slider('value'))+10;
|
||||||
|
var width =$('#mosaicGridContainer').innerWidth()-15;
|
||||||
|
var 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 bodyLoad(viewMode, bgcolor) {
|
function bodyLoad(vm, bgcolor) {
|
||||||
/* Parse hash */
|
/* Parse hash */
|
||||||
hash = window.location.hash;
|
hash = window.location.hash;
|
||||||
var h = $.parseQuery(hash.substring(1));
|
var h = $.parseQuery(hash.substring(1));
|
||||||
@ -225,10 +246,8 @@ function bodyLoad(viewMode, bgcolor) {
|
|||||||
currentImg = parseInt(h.img);
|
currentImg = parseInt(h.img);
|
||||||
if(h.bgcolor != undefined)
|
if(h.bgcolor != undefined)
|
||||||
swatchSkin(h.bgcolor);
|
swatchSkin(h.bgcolor);
|
||||||
if(h.viewMode == 'detail')
|
if(h.viewMode != undefined)
|
||||||
focusImage(currentImg, h.redirected);
|
viewMode = vm = h.viewMode;
|
||||||
else
|
|
||||||
viewMode = h.viewMode;
|
|
||||||
/* end parse hash */
|
/* end parse hash */
|
||||||
|
|
||||||
if(navigator.appName == "Microsoft Internet Explorer") $('.track').each(function(s){$(this).css('top', '-16px');}); //Fix for IE's poor page rendering.
|
if(navigator.appName == "Microsoft Internet Explorer") $('.track').each(function(s){$(this).css('top', '-16px');}); //Fix for IE's poor page rendering.
|
||||||
@ -253,15 +272,22 @@ function bodyLoad(viewMode, bgcolor) {
|
|||||||
if (co==null || co=="")
|
if (co==null || co=="")
|
||||||
swatchSkin(bgcolor);
|
swatchSkin(bgcolor);
|
||||||
|
|
||||||
|
if(typeof slideshowImages != 'undefined')
|
||||||
if(!slideshowImages.length)
|
if(!slideshowImages.length)
|
||||||
viewMode='grid';
|
vm='grid';
|
||||||
|
|
||||||
switch (viewMode) {
|
switch (vm) {
|
||||||
|
case 'carousel':
|
||||||
|
startImageFlow(false);
|
||||||
|
break;
|
||||||
case 'grid':
|
case 'grid':
|
||||||
switchToGrid();
|
switchToGrid(false);
|
||||||
break;
|
break;
|
||||||
case 'mosaic':
|
case 'mosaic':
|
||||||
switchToMosaic();
|
switchToMosaic(false);
|
||||||
|
break;
|
||||||
|
case 'detail':
|
||||||
|
focusImage(currentImg, h.redirected);
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
mosaicResize();
|
mosaicResize();
|
||||||
@ -272,10 +298,13 @@ function bodyLoad(viewMode, bgcolor) {
|
|||||||
setKeys();
|
setKeys();
|
||||||
}
|
}
|
||||||
|
|
||||||
function switchToGrid()
|
function switchToGrid(userSet)
|
||||||
{
|
{
|
||||||
|
if(userSet === true) {
|
||||||
|
viewMode = "grid";
|
||||||
|
}
|
||||||
toggleReflex(true);
|
toggleReflex(true);
|
||||||
$('#pearImageFlow').hide();
|
$('#pearImageFlow,#pearFlowPadd').hide();
|
||||||
$('#mosaicTable').show();
|
$('#mosaicTable').show();
|
||||||
if(!$('#mosaicGridContainer').length) return;
|
if(!$('#mosaicGridContainer').length) return;
|
||||||
mosaicView=false;
|
mosaicView=false;
|
||||||
@ -286,13 +315,15 @@ function switchToGrid()
|
|||||||
$('p.giTitle,div.giInfo').each(function(s){$(this).show();});
|
$('p.giTitle,div.giInfo').each(function(s){$(this).show();});
|
||||||
switchMode('grid');
|
switchMode('grid');
|
||||||
mosaicResize();
|
mosaicResize();
|
||||||
updateHash();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function switchToMosaic()
|
function switchToMosaic(userSet)
|
||||||
{
|
{
|
||||||
|
if(userSet === true) {
|
||||||
|
viewMode = "mosaic";
|
||||||
|
}
|
||||||
toggleReflex(false);
|
toggleReflex(false);
|
||||||
$('#pearImageFlow').hide(); //.hide();
|
$('#pearImageFlow,#pearFlowPadd').hide();
|
||||||
$('#mosaicTable').show();
|
$('#mosaicTable').show();
|
||||||
if(!$('#mosaicGridContainer').length) return;
|
if(!$('#mosaicGridContainer').length) return;
|
||||||
mosaicView=true;
|
mosaicView=true;
|
||||||
@ -361,39 +392,29 @@ function focusImage(id, redirected)
|
|||||||
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
$('#info_detail').attr('href', slideshowImages[currentImg][1]);
|
||||||
}
|
}
|
||||||
var pearCarousel;
|
var pearCarousel;
|
||||||
function startImageFlow()
|
function startImageFlow(userSet)
|
||||||
{
|
{
|
||||||
|
if(userSet === true) {
|
||||||
|
viewMode = "carousel";
|
||||||
|
}
|
||||||
$('#mosaicTable').hide();
|
$('#mosaicTable').hide();
|
||||||
|
|
||||||
$('#pearImageFlow').show();
|
$('#pearImageFlow,#pearFlowPadd').show();
|
||||||
|
|
||||||
toggleReflex(true);
|
toggleReflex(true);
|
||||||
|
|
||||||
|
if(!pearCarousel){
|
||||||
for (var i = 0; i < slideshowImages.length; i++) {
|
for (var 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 = '<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;">';
|
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);
|
// console.log(img);
|
||||||
$('#pearImageFlow').append(img);
|
$('#pearImageFlow').append(img);
|
||||||
}
|
}
|
||||||
if(!pearCarousel){
|
|
||||||
pearCarousel = new ImageFlow();
|
pearCarousel = new ImageFlow();
|
||||||
pearCarousel.init({ImageFlowID: 'pearImageFlow', aspectRatio: 2.4, imagesHeight: 0.6, opacity: true, reflections: false, startID: currentImg, 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});
|
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});
|
||||||
}
|
}
|
||||||
/*
|
|
||||||
current=(currentImg)*-xstep;
|
|
||||||
caption_id=currentImg;
|
|
||||||
refresh(true);
|
|
||||||
|
|
||||||
iShow(conf_images);
|
|
||||||
iShow(conf_scrollbar);
|
|
||||||
initMouseWheel();
|
|
||||||
initMouseDrag();
|
|
||||||
mosaicResize();
|
|
||||||
|
|
||||||
moveTo(current);
|
|
||||||
glideTo(current, caption_id);
|
|
||||||
*/
|
|
||||||
switchMode('carousel');
|
switchMode('carousel');
|
||||||
|
mosaicResize();
|
||||||
}
|
}
|
||||||
function setKeys()
|
function setKeys()
|
||||||
{
|
{
|
||||||
@ -436,6 +457,7 @@ var hovering=false;
|
|||||||
function switchMode(mode){
|
function switchMode(mode){
|
||||||
$('#mosaic,#grid,#carousel').removeClass("sel sel-with-viewSwitcher");
|
$('#mosaic,#grid,#carousel').removeClass("sel sel-with-viewSwitcher");
|
||||||
$('#'+mode).addClass("sel sel-with-viewSwitcher");
|
$('#'+mode).addClass("sel sel-with-viewSwitcher");
|
||||||
|
updateHash();
|
||||||
}
|
}
|
||||||
|
|
||||||
function preFetch()
|
function preFetch()
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
name = ".Pear Theme"
|
name = ".Pear Theme"
|
||||||
description = "A theme with the intention to mimic Apples mobile me gallery."
|
description = "A theme with the intention to mimic Apples mobile me gallery."
|
||||||
version = 2.3
|
version = 2.7
|
||||||
author = "Fredrik Erlandsson <fredrik.e@gmail.com>"
|
author = "Fredrik Erlandsson <fredrik.e@gmail.com>"
|
||||||
site = 1
|
site = 1
|
||||||
admin = 0
|
admin = 0
|
||||||
|
@ -30,13 +30,19 @@ $(function() {
|
|||||||
<? if ($child->is_photo()): ?>
|
<? if ($child->is_photo()): ?>
|
||||||
<? $img_class = "g-thumbnail p-photo"; ?>
|
<? $img_class = "g-thumbnail p-photo"; ?>
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
|
<? if ($child->is_movie()): ?>
|
||||||
|
<a href="<?= $child->url() ?>">
|
||||||
|
<? endif ?>
|
||||||
<div id="g-thumb-id-<?= $child->id ?>" class="g-item gallery-thumb <?= $item_class ?>" title="<?= $child->description?>">
|
<div id="g-thumb-id-<?= $child->id ?>" class="g-item gallery-thumb <?= $item_class ?>" title="<?= $child->description?>">
|
||||||
<?= $theme->thumb_top($child) ?>
|
<?= $theme->thumb_top($child) ?>
|
||||||
<? if ($child->is_album()): ?>
|
<? if ($child->is_album() || $child->is_movie()): ?>
|
||||||
<div class="gallery-thumb-round" style="height: 200px; width: 200px;"></div>
|
<div class="gallery-thumb-round"></div>
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
<? if ($child->has_thumb()): ?>
|
<? if ($child->has_thumb()): ?>
|
||||||
<?= $child->thumb_img(array("class" => $img_class, "id" => "thumb_$child->id", "style" => "width: 200px; height 200px;")) ?>
|
<?= $child->thumb_img(array("class" => $img_class, "id" => "thumb_$child->id", "style" => "width: 200px; height 200px;")) ?>
|
||||||
|
<? if ($child->is_movie()): ?>
|
||||||
|
<span class="p-video"></span>
|
||||||
|
<? endif ?>
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
<?// Begin skimming
|
<?// Begin skimming
|
||||||
if($child->is_album()):
|
if($child->is_album()):
|
||||||
@ -47,7 +53,7 @@ if($child->is_album()):
|
|||||||
<? if(++$i > 50) break; ?>
|
<? if(++$i > 50) break; ?>
|
||||||
<? if ($granchild->has_thumb()): ?>
|
<? if ($granchild->has_thumb()): ?>
|
||||||
<?= $granchild->thumb_img(array("style" => "display: none;")) ?>
|
<?= $granchild->thumb_img(array("style" => "display: none;")) ?>
|
||||||
<div class="skimm_div" style="height: 200px; width: <?=$step?>px; left: <?=$offset?>px; top: 0px;" onmouseover="$('#thumb_<?=$child->id?>').attr('src', '<?=$granchild->thumb_url()?>');skimimg=<?=$i?>;" id="area_<?=$granchild->id?>"></div>
|
<div class="skimm_div" style="height: 200px; width: <?=$step?>px; left: <?=$offset?>px; top: 0px;" onmouseover="$('#thumb_<?=$child->id?>').attr('src', '<?=$granchild->thumb_url()?>');skimimg=<?=$i-1?>;" id="area_<?=$granchild->id?>"></div>
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
<? $offset+=$step;
|
<? $offset+=$step;
|
||||||
endforeach;
|
endforeach;
|
||||||
@ -56,6 +62,9 @@ endif;
|
|||||||
<p class="giTitle <? if(!$child->is_album()) print 'center';?>"><?= html::purify(text::limit_chars($child->title, 20)) ?> </p>
|
<p class="giTitle <? if(!$child->is_album()) print 'center';?>"><?= html::purify(text::limit_chars($child->title, 20)) ?> </p>
|
||||||
<? if($child->is_album()): ?><div class="giInfo"><?= count($granchildren)?> photos</div><? endif ?>
|
<? if($child->is_album()): ?><div class="giInfo"><?= count($granchildren)?> photos</div><? endif ?>
|
||||||
</div>
|
</div>
|
||||||
|
<? if ($child->is_movie()): ?>
|
||||||
|
</a>
|
||||||
|
<? endif ?>
|
||||||
<?/* <?= $theme->thumb_bottom($child) ?>
|
<?/* <?= $theme->thumb_bottom($child) ?>
|
||||||
<?= $theme->context_menu($child, "#g-item-id-{$child->id} .g-thumbnail") ?>
|
<?= $theme->context_menu($child, "#g-item-id-{$child->id} .g-thumbnail") ?>
|
||||||
<h2><span class="<?= $item_class ?>"></span>
|
<h2><span class="<?= $item_class ?>"></span>
|
||||||
@ -69,7 +78,7 @@ endif;
|
|||||||
var slideshowImages = new Array();
|
var slideshowImages = new Array();
|
||||||
<? foreach ($children as $i => $child): ?>
|
<? foreach ($children as $i => $child): ?>
|
||||||
<? if(!($child->is_album() || $child->is_movie())): ?>
|
<? if(!($child->is_album() || $child->is_movie())): ?>
|
||||||
slideshowImages.push(['<?= $child->resize_url() ?>', '<?= url::site("exif/show/$child->id") ?>', '<?= $child->width ?>','<?= $child->height ?>', '<?= $child->title ?>', '<?= $child->file_url() ?>', '<?= $child->url() ?>']);
|
slideshowImages.push(['<?= $child->resize_url() ?>', '<?= url::site("exif/show/$child->id") ?>', '<?= $child->width ?>','<?= $child->height ?>', '<?= htmlentities($child->title, ENT_QUOTES) ?>', '<?= $child->file_url() ?>', '<?= $child->url() ?>']);
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
<? endforeach ?>
|
<? endforeach ?>
|
||||||
</script>
|
</script>
|
||||||
@ -87,4 +96,5 @@ endif;
|
|||||||
<?= $theme->album_bottom() ?>
|
<?= $theme->album_bottom() ?>
|
||||||
|
|
||||||
<?= $theme->paginator() ?>
|
<?= $theme->paginator() ?>
|
||||||
|
<div id="pearFlowPadd" class="imageflow" style="display: none;"></div>
|
||||||
<div id="pearImageFlow" class="imageflow" style="display: none;"> </div>
|
<div id="pearImageFlow" class="imageflow" style="display: none;"> </div>
|
||||||
|
@ -1,9 +1,12 @@
|
|||||||
<?php defined("SYSPATH") or die("No direct script access.") ?>
|
<?php defined("SYSPATH") or die("No direct script access.") ?>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$(function() { bodyLoad('grid',''); });
|
||||||
|
</script>
|
||||||
<div id="g-item">
|
<div id="g-item">
|
||||||
<?= $theme->photo_top() ?>
|
<?= $theme->photo_top() ?>
|
||||||
|
|
||||||
<?= $theme->paginator() ?>
|
<?= $theme->paginator() ?>
|
||||||
|
<div id="mosaicGridContainer">
|
||||||
<div id="g-movie" class="ui-helper-clearfix">
|
<div id="g-movie" class="ui-helper-clearfix">
|
||||||
<?= $theme->resize_top($item) ?>
|
<?= $theme->resize_top($item) ?>
|
||||||
<?= $item->movie_img(array("class" => "g-movie", "id" => "g-item-id-{$item->id}")) ?>
|
<?= $item->movie_img(array("class" => "g-movie", "id" => "g-item-id-{$item->id}")) ?>
|
||||||
@ -14,6 +17,6 @@
|
|||||||
<h1><?= html::purify($item->title) ?></h1>
|
<h1><?= html::purify($item->title) ?></h1>
|
||||||
<div><?= nl2br(html::purify($item->description)) ?></div>
|
<div><?= nl2br(html::purify($item->description)) ?></div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<?= $theme->photo_bottom() ?>
|
<?= $theme->photo_bottom() ?>
|
||||||
</div>
|
</div>
|
||||||
|
@ -122,7 +122,7 @@
|
|||||||
<? if ($theme->item()): ?>
|
<? if ($theme->item()): ?>
|
||||||
<? if(!empty($parents)): ?>
|
<? if(!empty($parents)): ?>
|
||||||
<? $parent = end($parents) ?>
|
<? $parent = end($parents) ?>
|
||||||
<button class="large push large-with-push" onclick="window.location='<?= $parent->url($parent->id == $theme->item()->parent_id ? "show={$theme->item()->id}" : null) ?>';// + '#viewMode=' + viewMode;"> <div class="outer"> <div class="label"> <?= html::purify(text::limit_chars($parent->title, module::get_var("gallery", "visible_title_length"))) ?></div> </div></button>
|
<button class="large push large-with-push" onclick="window.location='<?= $parent->url($parent->id == $theme->item()->parent_id ? "show={$theme->item()->id}" : null) ?>' + '#viewMode=' + viewMode;"> <div class="outer"> <div class="label"> <?= html::purify(text::limit_chars($parent->title, module::get_var("gallery", "visible_title_length"))) ?></div> </div></button>
|
||||||
<? endif ?>
|
<? endif ?>
|
||||||
</div>
|
</div>
|
||||||
<div class="pearTitle" title="<?= $theme->item()->description ?>"> <?= html::purify(text::limit_chars($theme->item()->title, 40)) ?>
|
<div class="pearTitle" title="<?= $theme->item()->description ?>"> <?= html::purify(text::limit_chars($theme->item()->title, 40)) ?>
|
||||||
@ -154,8 +154,8 @@
|
|||||||
<div id="footerWrapper">
|
<div id="footerWrapper">
|
||||||
<div title="Change size of photos" id="sliderView" class="sliderView">
|
<div title="Change size of photos" id="sliderView" class="sliderView">
|
||||||
<div class="sliderRightCap"></div>
|
<div class="sliderRightCap"></div>
|
||||||
<div title="View at smallest photo size" class="smaller" onclick="$('#slider').slider('value', 0);"></div>
|
<div title="View at smallest photo size" class="smaller" onclick="$('#imgSlider').slider('value', 0);"></div>
|
||||||
<div title="View at largest photo size" class="larger" onclick="$('#slider').slider('value', 250);"></div>
|
<div title="View at largest photo size" class="larger" onclick="$('#imgSlider').slider('value', 250);"></div>
|
||||||
<div id="imgSlider" class="track">
|
<div id="imgSlider" class="track">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -169,14 +169,15 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="" style="" id="viewControls">
|
<div class="" style="" id="viewControls">
|
||||||
<div title="Display this album in a grid view" id="grid" class="grid viewSwitcher sel sel-with-viewSwitcher" onclick="switchToGrid();">
|
<? if ($theme->page_subtype != "movie"): ?>
|
||||||
|
<div title="Display this album in a grid view" id="grid" class="grid viewSwitcher sel sel-with-viewSwitcher" onclick="switchToGrid(true);">
|
||||||
<div class="label">Grid</div>
|
<div class="label">Grid</div>
|
||||||
</div>
|
</div>
|
||||||
<div title="Display this album in a mosaic view" id="mosaic" class="viewSwitcher mosaic" onclick="switchToMosaic();">
|
<div title="Display this album in a mosaic view" id="mosaic" class="viewSwitcher mosaic" onclick="switchToMosaic(true);">
|
||||||
<!-- <div style="margin-top:-2px;margin-left:-4px;"> -->
|
<!-- <div style="margin-top:-2px;margin-left:-4px;"> -->
|
||||||
<div class="label">Mosaic</div>
|
<div class="label">Mosaic</div>
|
||||||
</div>
|
</div>
|
||||||
<div title="Display this album in a carousel view" id="carousel" class="carousel viewSwitcher" onclick="startImageFlow();">
|
<div title="Display this album in a carousel view" id="carousel" class="carousel viewSwitcher" onclick="startImageFlow(true);">
|
||||||
<!-- <div style="margin-top:-2px;"> -->
|
<!-- <div style="margin-top:-2px;"> -->
|
||||||
<div class="label">Carousel</div>
|
<div class="label">Carousel</div>
|
||||||
</div>
|
</div>
|
||||||
@ -185,6 +186,7 @@
|
|||||||
<div class="label">Slideshow</div>
|
<div class="label">Slideshow</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clear"></div>
|
<div class="clear"></div>
|
||||||
|
<? endif ?>
|
||||||
</div>
|
</div>
|
||||||
<? if (!module::get_var("th_pear4gallery3", "hide_logo")): ?><button id="logoButton"></button><?endif?>
|
<? if (!module::get_var("th_pear4gallery3", "hide_logo")): ?><button id="logoButton"></button><?endif?>
|
||||||
</div>
|
</div>
|
||||||
|
Reference in New Issue
Block a user