[Linpha-cvs] SF.net SVN: linpha: [4580] trunk/linpha2
Status: Inactive
Brought to you by:
bzrudi
Menu
▾
▴
[Linpha-cvs] SF.net SVN: linpha: [4580] trunk/linpha2
|
From: <fan...@us...> - 2006-10-09 20:53:27
|
Revision: 4580
http://svn.sourceforge.net/linpha/?rev=4580&view=rev
Author: fangehrn
Date: 2006-10-09 13:52:58 -0700 (Mon, 09 Oct 2006)
Log Message:
-----------
2006-10-08 flo
* implemented keyboard navigation ('n' for next, 'p' for prev, other suggestions?)
* implemented full screen view with navigation
please have a look!! :-)
Modified Paths:
--------------
trunk/linpha2/ChangeLog
trunk/linpha2/get_image.php
trunk/linpha2/lib/classes/linpha.imgview.class.php
trunk/linpha2/lib/classes/linpha.import.class.php
trunk/linpha2/lib/js/LinGlobal.js
trunk/linpha2/lib/js/LinImage.js
trunk/linpha2/lib/js/LinThumbnails.js
trunk/linpha2/templates/default/css/global.css
trunk/linpha2/templates/default/css/view_img.css
trunk/linpha2/templates/default/global.html.php
trunk/linpha2/templates/default/view_img.head.php
trunk/linpha2/templates/default/view_img.html.php
trunk/linpha2/templates/default/view_img_static.html.php
Modified: trunk/linpha2/ChangeLog
===================================================================
--- trunk/linpha2/ChangeLog 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/ChangeLog 2006-10-09 20:52:58 UTC (rev 4580)
@@ -1,4 +1,9 @@
2006-10-08 flo
+ * implemented keyboard navigation ('n' for next, 'p' for prev, other suggestions?)
+ * implemented full screen view with navigation
+ please have a look!! :-)
+
+2006-10-08 flo
* some minor improvements
2006-10-08 flo
Modified: trunk/linpha2/get_image.php
===================================================================
--- trunk/linpha2/get_image.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/get_image.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -23,7 +23,7 @@
* @package Image
*/
-sleep(5);
+//sleep(5);
if(!defined('LINPHA_DIR')) { define('LINPHA_DIR','.'); }
Modified: trunk/linpha2/lib/classes/linpha.imgview.class.php
===================================================================
--- trunk/linpha2/lib/classes/linpha.imgview.class.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/lib/classes/linpha.imgview.class.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -420,6 +420,9 @@
$GLOBALS['linpha']->template->output['menu_Icons'] = '';
if($this->mode == 'thumb')
{
+ /**
+ * basket icons
+ */
if( $GLOBALS['linpha']->sql->checkPermission('basket_download'))
{
$GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="'.$GLOBALS['linpha']->template->URL_full.'&admin_cmd=basket_add_all_with_checkout&checkout_as=download">'.
@@ -438,9 +441,21 @@
'<img src="'.LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/slideshow.png" border="0" title="'.i18n("Mail Images").'" />'
.'</a>'."\n";
}
+ /**
+ * slideshow icons
+ */
+ if( $_SESSION['use_js']) {
+ $GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="javascript:slideshowStartFromThumbview()">'.
+ '<img src="'.LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/slideshow.png" border="0" title="'.i18n("Play Slideshow").'" />'
+ .'</a>'."\n";
+ }
+
}
elseif($this->mode == 'image')
{
+ /**
+ * basket icons
+ */
if( $GLOBALS['linpha']->sql->checkPermission('download'))
{
$GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="'.LINPHA_DIR.'/download_file.php?id='.$this->id_current.'">'.
@@ -459,6 +474,15 @@
'<img src="'.LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/slideshow.png" border="0" title="'.i18n("Mail Image").'" />'
.'</a>'."\n";
}
+
+ /**
+ * slideshow icons
+ */
+ if( $_SESSION['use_js']) {
+ $GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="javascript:myLinImage.fullscreenStart()">'.
+ '<img src="'.LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/slideshow.png" border="0" title="'.i18n("Play Slideshow").'" />'
+ .'</a>'."\n";
+ }
}
}
@@ -526,7 +550,7 @@
* prepare stuff for slideshow
* @uses LinImgview::buildImgView()
*/
-function slideshow()
+/*function slideshow()
{
foreach($this->photos_filtered AS $key=>$photo_value)
{
@@ -568,7 +592,7 @@
'<br /><a href="#" onclick="myLightbox.start();">'.i18n("Start Slideshow").'<img src="'.LINPHA_DIR.'/templates/default/images/slideshow.png" border="0" /></a>'."\n".
'</div>'."\n";
}
-}
+}*/
@@ -1098,6 +1122,7 @@
<imgid><?php echo $this->id_current; ?></imgid>
<imgwidth><?php echo $this->org_width; ?></imgwidth>
<imgheight><?php echo $this->org_height; ?></imgheight>
+<imgnr><?php printf(i18n("Image %s of %s"),$this->current_key+1,count($this->photos_filtered)); ?></imgnr>
<title><?php echo str_replace('<','<',$GLOBALS['linpha']->template->linpha_title." :: ".$GLOBALS['linpha']->template->output['title']); ?></title>
<?php
if(isset($this->xmldata['prev_thumb'])) {
Modified: trunk/linpha2/lib/classes/linpha.import.class.php
===================================================================
--- trunk/linpha2/lib/classes/linpha.import.class.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/lib/classes/linpha.import.class.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -452,7 +452,15 @@
*/
function getIgnoreFilelist()
{
- return Array('CVS','Thumbs.db','ZbThumbnail.info','lost+found');
+ return Array(
+ 'CVS', // CVS
+ 'Thumbs.db', // Windows
+ 'ZbThumbnail.info', // ?
+ '_vti_cnf', // IIS
+ '_derived', // IIS
+ 'lost+found' // Linux
+ );
+
}
Modified: trunk/linpha2/lib/js/LinGlobal.js
===================================================================
--- trunk/linpha2/lib/js/LinGlobal.js 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/lib/js/LinGlobal.js 2006-10-09 20:52:58 UTC (rev 4580)
@@ -18,10 +18,12 @@
*
* ajax may be disabled with ./?cat=ajax&disable_ajax
* and may be re-enabled with ./?cat=ajax&enable_ajax
+ *
+ * http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
*/
function checkAjaxCompatibility()
{
- new Ajax.Request(LINPHA_DIR + '/?cat=ajax&use_js', {asynchronous:true, onSuccess:checkAjaxCompatibilitySuccess} );
+ new Ajax.Request(LINPHA_DIR + '/?cat=ajax&use_js', {method:'get', asynchronous:true, onSuccess:checkAjaxCompatibilitySuccess} );
}
/**
@@ -39,32 +41,34 @@
*
* sets the height in thumb and image view of the "divmain"
*/
-function setMainHeight()
+var linInnerWidth, linInnerHeight;
+
+function getWindowSize()
{
-
/**
- * get some values
* browser incompatibilities...
- *
- * needs to be in display_images!
*/
- var linInnerWidth, linInnerHeight;
if (window.innerHeight) // all except Explorer
{
- //linInnerWidth = self.innerWidth;
+ linInnerWidth = self.innerWidth;
linInnerHeight = self.innerHeight;
}
else if (document.body && document.body.offsetWidth)
{
- //linInnerWidth = document.body.offsetWidth;
+ linInnerWidth = document.body.offsetWidth;
linInnerHeight = document.body.offsetHeight;
}
else
{
- //linInnerWidth = 500; // take a default value (@todo needs testing, maybe anyway never needed)
- linInnerHeight = 300; // take a default value (needs teseting)
- }
+ linInnerWidth = 500;
+ linInnerHeight = 300;
+ }
+}
+function setMainHeight()
+{
+ getWindowSize();
+
var newHeight = linInnerHeight - $('main').offsetTop - 40; // 35 = 15 (bottom rounded corners) + 10 (margin-bottom) + 15 (??)
if(newHeight < 100)
{
@@ -72,6 +76,5 @@
}
$('main').style.height = newHeight;
-
}
Modified: trunk/linpha2/lib/js/LinImage.js
===================================================================
--- trunk/linpha2/lib/js/LinImage.js 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/lib/js/LinImage.js 2006-10-09 20:52:58 UTC (rev 4580)
@@ -4,6 +4,10 @@
}
var curImgId;
+var nextThumbs = new Array();
+var prevThumbs = new Array();
+var slideshowActive = false;
+var slideshowOldMaxWidth, slideshowOldMaxHeight;
var xmlDoc = new Array();
var preloadImage = new Array();
@@ -39,7 +43,7 @@
loadImageXml: function(imgId) {
// http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
- new Ajax.Request(xmlUrl + '&id=' + imgId + '&xml', {asynchronous:true, onSuccess:this.loadImageContinue, onFailure:errFunc} );
+ new Ajax.Request(xmlUrl + '&id=' + imgId + '&xml', {method:'get', asynchronous:true, onSuccess:this.loadImageContinue, onFailure:errFunc} );
},
loadImageContinue: function(t) {
@@ -59,6 +63,18 @@
}
},
+ movePrev: function() {
+ if(prevThumbs[ prevThumbs.length - 1 ])
+ {
+ myLinImage.loadImage(prevThumbs[ prevThumbs.length - 1 ]);
+ }
+ },
+ moveNext: function() {
+ if(nextThumbs[0])
+ {
+ myLinImage.loadImage(nextThumbs[0]);
+ }
+ },
//
// changeImage()
@@ -66,12 +82,17 @@
changeImage: function() {
/**
- * hide meta text immediately
+ * set height of outer div to prevent the whole page getting smaller, and if the image is loaded getting bigger again
+ * but we want no activities in background
*/
- hideImgInfoNow();
+ if(! slideshowActive) {
+ $('divimage').style.height = $('mainImage').style.height;
+ }
- // hide elements during transition
- $('divimage').style.height = $('mainImage').style.height; // set height of outer div to prevent the whole page getting smaller, and if the image is loaded getting bigger again
+ /**
+ * hide elements during transition
+ */
+ hideImgInfoNow(); // hide meta text immediately
Element.show('divloading');
Element.hide('mainImage');
Element.hide('divinfolinks');
@@ -81,9 +102,9 @@
*/
var orgWidth = xmlDoc[curImgId].getElementsByTagName('imgwidth').item(0).firstChild.data;
var orgHeight = xmlDoc[curImgId].getElementsByTagName('imgheight').item(0).firstChild.data;
- var sizeArray = scaleToFit(orgWidth,orgHeight,imageSize,imageSize,1);
- imgWidth = sizeArray[0];
- imgHeight = sizeArray[1];
+ var sizeArray = scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
+ var imgWidth = sizeArray[0];
+ var imgHeight = sizeArray[1];
/**
* preload image
@@ -91,7 +112,13 @@
var currentImgSrc = imageSrc + curImgId + '&max_width=' + imgWidth + '&max_height=' + imgHeight;
imgPreloader = new Image();
- // once image is preloaded, resize image container
+ /**
+ * once image is preloaded, resize image container
+ *
+ * pay attention with other image preloader!
+ * if imgWidth and imgWidth was not set with trailing 'var' it got overlapping with the other variables
+ * and hence the image was not resized correctly in resizeImageContainer() !!!
+ */
imgPreloader.onload=function(){
preloadImageFinished[curImgId] = true;
$('mainImage').src = currentImgSrc;
@@ -144,8 +171,13 @@
showImage: function(){
Element.hide('divloading');
new Effect.Appear('mainImage', { duration: 0.5, afterFinish: function(){ myLinImage.setImageInfoLink(); } });
- $('divimage').style.height = $('mainImage').style.height; // reset to correct height to prevent trouble if image is bigger or smaller
+ if(! slideshowActive) {
+ $('divimage').style.height = $('mainImage').style.height; // reset to correct height to prevent trouble if image is bigger or smaller
+ }
+
+ this.enableKeyboardNav();
+
this.setImageData();
this.preloadXml();
},
@@ -167,23 +199,14 @@
* set prev thumbs
*/
$('thumbnavi_prevthumb').innerHTML = '';
+ prevThumbs = new Array();
if(xmlDoc[curImgId].getElementsByTagName('prevthumb').length > 0)
{
for(var i = 0; i < xmlDoc[curImgId].getElementsByTagName('prevthumb').length; i++)
{
- var prevThumbId = xmlDoc[curImgId].getElementsByTagName('prevthumb').item(i).firstChild.data;
-
- var ElemImg = Builder.node('img', {id: 'thumb'+prevThumbId, className: 'img_prevnextthumb', src: thumbSrc + prevThumbId});
- var ElemA = Builder.node('a', {href: 'javascript:myLinImage.loadImage(' + prevThumbId + ')'});
- var ElemDiv = Builder.node('div', {className: 'thumbnavi_prevnextthumb'});
-
- ElemA.appendChild( ElemImg );
- ElemDiv.appendChild( ElemA );
- $('thumbnavi_prevthumb').appendChild(ElemDiv);
-
- if(! preloadImageFinished[prevThumbId]) {
- Element.setOpacity('thumb'+prevThumbId,0.5);
- }
+ var thumbId = xmlDoc[curImgId].getElementsByTagName('prevthumb').item(i).firstChild.data;
+ prevThumbs[i] = thumbId;
+ this.setPrevNextThumb(thumbId, 'thumbnavi_prevthumb');
}
}
@@ -191,23 +214,14 @@
* set next thumbs
*/
$('thumbnavi_nextthumb').innerHTML = '';
+ nextThumbs = new Array();
if(xmlDoc[curImgId].getElementsByTagName('nextthumb').length > 0)
{
for(var i = 0; i < xmlDoc[curImgId].getElementsByTagName('nextthumb').length; i++)
{
- var nextThumbId = xmlDoc[curImgId].getElementsByTagName('nextthumb').item(i).firstChild.data;
-
- var ElemImg = Builder.node('img', {id: 'thumb'+nextThumbId, className: 'img_prevnextthumb', src: thumbSrc + nextThumbId});
- var ElemA = Builder.node('a', {href: 'javascript:myLinImage.loadImage(' + nextThumbId + ')'});
- var ElemDiv = Builder.node('div', {className: 'thumbnavi_prevnextthumb'});
-
- ElemA.appendChild( ElemImg );
- ElemDiv.appendChild( ElemA );
- $('thumbnavi_nextthumb').appendChild(ElemDiv);
-
- if(! preloadImageFinished[nextThumbId]) {
- Element.setOpacity('thumb'+nextThumbId,0.5);
- }
+ var thumbId = xmlDoc[curImgId].getElementsByTagName('nextthumb').item(i).firstChild.data;
+ nextThumbs[i] = thumbId;
+ this.setPrevNextThumb(thumbId, 'thumbnavi_nextthumb');
}
}
@@ -255,20 +269,45 @@
}
}
+ /**
+ * set image nr
+ * currently only in slideshow used
+ */
+ $('divSlideshowImgNr').innerHTML = xmlDoc[curImgId].getElementsByTagName('imgnr').item(0).firstChild.data;
+
}, // end function setImageData()
+ setPrevNextThumb: function(thumbId, divId)
+ {
+ var ElemImg = Builder.node('img', {id: 'thumb'+thumbId, className: 'img_prevnextthumb', src: thumbSrc + thumbId});
+ var ElemA = Builder.node('a', {href: 'javascript:myLinImage.loadImage(' + thumbId + ')'});
+ var ElemDiv = Builder.node('div', {className: 'thumbnavi_prevnextthumb'});
+
+ ElemA.appendChild( ElemImg );
+ ElemDiv.appendChild( ElemA );
+ $(divId).appendChild(ElemDiv);
+
+ if(! preloadImageFinished[thumbId]) {
+ Element.setOpacity('thumb'+thumbId,0.5);
+ }
+
+ },
+
/**
* setImageInfoLink
*
* set positions of info link
* could only be done after image has been completly loaded
*/
- setImageInfoLink: function() {
- $('divinfolinks').style.top = $('mainImage').offsetTop + $('mainImage').offsetHeight;
- $('divinfolinks').style.left = $('mainImage').offsetLeft + $('mainImage').offsetWidth - 50; // 50: value of view_img.css width = 50px; can't get width with javascript because element is hidden
- Element.show('divinfolinks');
-
+ setImageInfoLink: function()
+ {
+ if(! slideshowActive)
+ {
+ $('divinfolinks').style.top = $('mainImage').offsetTop + $('mainImage').offsetHeight;
+ $('divinfolinks').style.left = $('mainImage').offsetLeft + $('mainImage').offsetWidth - 50; // 50: value of view_img.css width = 50px; can't get width with javascript because element is hidden
+ Element.show('divinfolinks');
+ }
},
//
@@ -297,21 +336,15 @@
key = String.fromCharCode(keycode).toLowerCase();
- if((key == 'x') || (key == 'o') || (key == 'c')){ // close lightbox
- myLinImage.end();
+ if( slideshowActive && ( (key == 'x') || (key == 'o') || (key == 'c') ) ) { // close slideshow
+ myLinImage.fullscreenStop();
} else if(key == 'p'){ // display previous image
- if(activeImage != 0){
- myLinImage.disableKeyboardNav();
- myLinImage.changeImage(activeImage - 1);
- }
+ myLinImage.disableKeyboardNav();
+ myLinImage.movePrev();
} else if(key == 'n'){ // display next image
- if(activeImage != (imageArray.length - 1)){
- myLinImage.disableKeyboardNav();
- myLinImage.changeImage(activeImage + 1);
- }
+ myLinImage.disableKeyboardNav();
+ myLinImage.moveNext();
}
-
-
},
//
@@ -360,9 +393,9 @@
*/
var orgWidth = xmlDoc[imgId].getElementsByTagName('imgwidth').item(0).firstChild.data;
var orgHeight = xmlDoc[imgId].getElementsByTagName('imgheight').item(0).firstChild.data;
- var sizeArray = scaleToFit(orgWidth,orgHeight,imageSize,imageSize,1);
- imgWidth = sizeArray[0];
- imgHeight = sizeArray[1];
+ var sizeArray = scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
+ var imgWidth = sizeArray[0];
+ var imgHeight = sizeArray[1];
var currentImgSrc = imageSrc + imgId + '&max_width=' + imgWidth + '&max_height=' + imgHeight;
@@ -381,12 +414,126 @@
preloadImageFinished: function(imgId) {
new Effect.Appear('thumb'+imgId, { duration: 0.5, from: 0.5, to: 1.0 });
preloadImageFinished[imgId] = true;
+ },
+
+ fullscreenStart: function()
+ {
+ slideshowActive = true;
+
+ /**
+ * save old values to restore if slideshow ends
+ * and set new window size
+ */
+ slideshowOldMaxWidth = maxImageWidth;
+ slideshowOldMaxHeight = maxImageHeight;
+ onWindowResize();
+
+ /**
+ * start slideshow with some superduper effects
+ */
+ Effect.Appear('divSlideshowOverlay', { queue: 'end', duration: 1.0, from: 0.0, to: 0.9 });
+ Effect.BlindDown('divSlideshowControls', { queue: 'end'} );
+ Element.show('divSlideshowImage');
+
+ /**
+ * steal the mainimage
+ */
+ $('divimage').innerHTML = '';
+ $('divSlideshowImage').innerHTML = '<img id="mainImage" style="display: none;" class="imgSlideshow">';
+
+ /**
+ * reload image with new position and size
+ */
+ this.loadImage( curImgId );
+ },
+
+
+ fullscreenStop: function()
+ {
+ slideshowActive = false;
+
+ /**
+ * restore max image size
+ */
+ maxImageWidth = slideshowOldMaxWidth;
+ maxImageHeight = slideshowOldMaxHeight;
+
+ /**
+ * end slideshow with some superduper effects
+ */
+ Effect.Fold('divSlideshowControls', { queue: 'end'} );
+ Effect.Fade('divSlideshowOverlay', { queue: 'end', duration: 0.5, from: 0.9, to: 0.0 } );
+ Element.hide('divSlideshowImage');
+
+ /**
+ * give back the mainimage
+ */
+ $('divSlideshowImage').innerHTML = '';
+ $('divimage').innerHTML = '<img id="mainImage" style="display: none;">';
+
+ /**
+ * reload image with old position and size
+ */
+ this.loadImage( curImgId );
+ },
+
+ slideshowPlay: function()
+ {
+ },
+ slideshowPause: function()
+ {
+
+ },
+ slideshowChangeDelay: function()
+ {
+ //currentDelay=document.optionsForm.delay.options[document.optionsForm.delay.selectedIndex].value * 1000;*/
}
}
+/**
+ * onWindowResize
+ *
+ * will be called if the window is resized
+ */
+function onWindowResize()
+{
+ if(slideshowActive)
+ {
+ getWindowSize();
+ maxImageWidth = linInnerWidth - 70;
+ maxImageHeight = linInnerHeight - 120;
+ }
+ else
+ {
+ myLinImage.setImageInfoLink();
+ // setMainHeight(); // defined in LinGlobal.js
+ }
+}
+
+/**
+ * init on finished page load
+ */
+function initLinImage()
+{
+ setInfoColors();
+ $('divimage').style.height = startImgHeight; // initial sets correct height at begin and not after the image is loaded
+ $('mainImage').style.height = startImgHeight; // initial sets correct height at begin and not after the image is loaded
+ myLinImage = new LinImage();
+ myLinImage.loadImage(startImgId);
+// setMainHeight(); // defined in LinGlobal.js
+ window.onresize = onWindowResize;
+
+}
+Event.observe(window, 'load', initLinImage, false);
+
// -----------------------------------------------------------------------------------
+// end class LinImage
+// -----------------------------------------------------------------------------------
+// -----------------------------------------------------------------------------------
+// Common used functions
+// -----------------------------------------------------------------------------------
var colorinfoactive;
var colorinfonotactive;
@@ -487,28 +634,15 @@
}
/**
- * onWindowResize
+ * openTextarea()
*
- * will be called if the window is resized
+ * opens the bigger textarea to enter longer image comments
+ * this function is defined in view_img_static.html.php too
*/
-function onWindowResize()
+function openTextarea()
{
- myLinImage.setImageInfoLink();
-// setMainHeight(); // defined in LinGlobal.js
-}
-
-/**
- * init on finished page load
- */
-function initLinImage()
-{
- setInfoColors();
- $('divimage').style.height = startImgHeight; // initial sets correct height at begin and not after the image is loaded
- $('mainImage').style.height = startImgHeight; // initial sets correct height at begin and not after the image is loaded
- myLinImage = new LinImage();
- myLinImage.loadImage(startImgId);
-// setMainHeight(); // defined in LinGlobal.js
- window.onresize = onWindowResize;
+ document.getElementById('comment_textarea').style.display = 'block';
+ document.getElementById('comment_div_text').style.display = 'none';
-}
-Event.observe(window, 'load', initLinImage, false);
+ document.getElementById('comment_textarea').value = document.getElementById('comment_input_text').value;
+}
\ No newline at end of file
Modified: trunk/linpha2/lib/js/LinThumbnails.js
===================================================================
--- trunk/linpha2/lib/js/LinThumbnails.js 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/lib/js/LinThumbnails.js 2006-10-09 20:52:58 UTC (rev 4580)
@@ -33,6 +33,7 @@
{
/**
* set correct main height only if photos_per_page == auto
+ * needs to be in display_images!
*/
setMainHeight(); // defined in LinGlobal.js
@@ -420,6 +421,16 @@
}
/**
+ * slideshowStartFromThumbview()
+ *
+ * to start the slideshow, first open imageview with first image, and then start slideshow
+ */
+function slideshowStartFromThumbview()
+{
+ location.href = link_url + '&id=' + img_ids[0]['id'] + '&slideshow';
+}
+
+/**
* function view_source_code() removed
* use firefox extension "Aardvark"
* much nicer ;-)
Modified: trunk/linpha2/templates/default/css/global.css
===================================================================
--- trunk/linpha2/templates/default/css/global.css 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/css/global.css 2006-10-09 20:52:58 UTC (rev 4580)
@@ -23,9 +23,9 @@
/**
* background color
- * #divthumbnavi used in view_img.html.php
+ * #divthumbnavi amd #divSlideshowControls used in view_img.html.php
*/
- #divleft, #divmain, #divright, #divthumbnavi, #divnavigation {
+ #divleft, #divmain, #divright, #divthumbnavi, #divnavigation, #divSlideshowControls {
background-color: #f90;
}
@@ -306,21 +306,4 @@
display: block !important;
}
-/**
- * slieshow
- */
-#slideshow {
- position: absolute;
- top: 150px;
- left: 150px;
-
- width: 400px;
- height: 150px;
-
- padding: 5px;
-
- background-color: #d5fcf4;
-
- border: 1px solid #000000;
-}
-->
\ No newline at end of file
Modified: trunk/linpha2/templates/default/css/view_img.css
===================================================================
--- trunk/linpha2/templates/default/css/view_img.css 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/css/view_img.css 2006-10-09 20:52:58 UTC (rev 4580)
@@ -111,4 +111,58 @@
width: 200px;
margin: 5px;
margin-left: 150px;
- }
\ No newline at end of file
+ }
+
+/**
+ * slieshow
+ */
+#divSlideshowOverlay
+{
+ position: absolute;
+ top: 0px;
+ left: 0px;
+
+ width: 100%;
+ height: 100%;
+
+ padding: 0px;
+ margin: 0px;
+
+ z-index: 90;
+ background-color: #000;
+}
+
+#divSlideshowControls
+{
+ position: absolute;
+ top: 0px;
+ left: 50%;
+
+ padding: 0px;
+ margin: 0px;
+
+ width: 500px;
+ margin-left: -250px; /* should be the half of 'width' */
+
+ z-index: 91;
+}
+
+
+#divSlideshowImage {
+ position: absolute;
+ top: 60px;
+
+ padding: 0px;
+ margin: 0px;
+
+ width: 100%;
+
+ z-index: 91;
+ text-align: center;
+}
+
+.imgSlideshow {
+ border: 20px solid white;
+}
+
+
Modified: trunk/linpha2/templates/default/global.html.php
===================================================================
--- trunk/linpha2/templates/default/global.html.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/global.html.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -88,7 +88,6 @@
<?php if( isset( $GLOBALS['linpha']->template->output['menu_Icons'] ) ) {
echo $GLOBALS['linpha']->template->output['menu_Icons'];
} ?>
- <a href="<?php echo $GLOBALS['linpha']->template->URL_full; ?>&slideshow=play"><img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/slideshow.png'; ?>" border="0" title="<?php echo i18n("Play Slideshow"); ?>" /></a>
</div>
<?php if($GLOBALS['linpha']->sql->isLoggedIn()) { ?>
Modified: trunk/linpha2/templates/default/view_img.head.php
===================================================================
--- trunk/linpha2/templates/default/view_img.head.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/view_img.head.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -3,7 +3,8 @@
var xmlUrl = '<?php echo convert_amp($GLOBALS['linpha']->template->URL_base); ?>';
var imageSrc = '<?php echo LINPHA_DIR.'/get_image.php?id='; ?>';
var thumbSrc = '<?php echo LINPHA_DIR.'/get_thumb.php?id='; ?>';
-var imageSize = <?php echo $GLOBALS['linpha']->sql->config->value['sys_style_image_size']; ?>;
+var maxImageWidth = <?php echo $GLOBALS['linpha']->sql->config->value['sys_style_image_size']; ?>;
+var maxImageHeight = <?php echo $GLOBALS['linpha']->sql->config->value['sys_style_image_size']; ?>;
var startImgId = <?php echo $GLOBALS['linpha']->imgview->id_current; ?>;
var startImgHeight = <?php echo $GLOBALS['linpha']->imgview->img_height; ?>;
</script>
Modified: trunk/linpha2/templates/default/view_img.html.php
===================================================================
--- trunk/linpha2/templates/default/view_img.html.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/view_img.html.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -26,7 +26,7 @@
</div>
<div id="main">
<div id="divloading">
- <img src="<?php echo LINPHA_DIR; ?>/lib/classes/lightbox/images/loading.gif">
+ <img src="<?php echo LINPHA_DIR; ?>/lib/graphics/loading.gif">
</div>
<noscript><h1><?php echo i18n("If you have just disabled Javascript, you will need to restart your browser."); ?></h1></noscript>
@@ -61,15 +61,6 @@
<input type="submit" name="submit" value="<?php echo i18n("submit"); ?>" />
</form>
</div>
- <script language="JavaScript" type="text/javascript">
- function openTextarea()
- {
- document.getElementById('comment_textarea').style.display = 'block';
- document.getElementById('comment_div_text').style.display = 'none';
-
- document.getElementById('comment_textarea').value = document.getElementById('comment_input_text').value;
- }
- </script>
<br />
<?php } /* end if checkPermission('metadata_comments') */ ?>
@@ -81,4 +72,49 @@
<div class="roundbottom">
<img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/bl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
</div>
-</div>
\ No newline at end of file
+</div>
+
+
+<div id="divSlideshowOverlay" style="display: none;"></div>
+<div id="divSlideshowControls" style="display: none;">
+ <div style="float: left; padding-left: 5px; ">
+ <a href="javascript:myLinImage.movePrev()"><img src="<?php echo LINPHA_DIR; ?>/lib/graphics/prev.gif" width="25" height="25" border="0"></a>
+ <a href="javascript:myLinImage.moveNext()"><img src="<?php echo LINPHA_DIR; ?>/lib/graphics/next.gif" width="25" height="25" border="0"></a>
+ ||
+ <a href="javascript:myLinImage.slideshowPlay()">Play</a>/<a href="javascript:myLinImage.slideshowPause()">Pause</a>
+ <?php echo i18n("Delay"); ?>:
+ <select id="delay" name="delay" size="1" onchange="changeDelay()">
+ <option value="3">3 s</option>
+ <option value="4">4 s</option>
+ <option value="5" selected>5 s</option>
+ <option value="10">10 s</option>
+ <option value="15">15 s</option>
+ <option value="30">30 s</option>
+ <option value="45">45 s</option>
+ <option value="60">60 s</option>
+ </select>
+ ||
+ </div>
+ <div id="divSlideshowImgNr" style="float: left;"></div>
+ ||
+ <a href="javascript:myLinImage.fullscreenStop()"><img src="<?php echo LINPHA_DIR; ?>/lib/graphics/close.gif" width="25" height="25" border="0"></a>
+
+
+ <div style="clear: both;"></div>
+ <div class="roundbottom">
+ <img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/bl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
+ </div>
+</div>
+<div id="divSlideshowImage" style="display: none;"></div>
+
+<!--
+<div id="divSlideshowImage" style="display: none;">
+ <div class="roundtop">
+ <img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/tl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
+ </div>
+ <div id="divSlideshowImageInner"></div>
+ <div class="roundbottom">
+ <img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/bl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
+ </div>
+</div>
+-->
Modified: trunk/linpha2/templates/default/view_img_static.html.php
===================================================================
--- trunk/linpha2/templates/default/view_img_static.html.php 2006-10-08 22:20:11 UTC (rev 4579)
+++ trunk/linpha2/templates/default/view_img_static.html.php 2006-10-09 20:52:58 UTC (rev 4580)
@@ -51,7 +51,7 @@
<?php echo i18n("Add Comment"); ?>:<br />
<div id="comment_div_text">
<input type="text" id="comment_input_text" name="comment_text" value="" tabindex="1" size="40" maxlength="40" />
- <a href="javascript:open_textarea()">(+)</a>
+ <a href="javascript:openTextarea()">(+)</a>
</div>
<textarea style="display: none;" id="comment_textarea" name="comment_textarea" tabindex="1" rows="10" cols="50"></textarea>
<?php echo i18n("Name"); ?>: <input type="text" name="author" value="" tabindex="2" size="10" maxlength="40" />
@@ -60,7 +60,7 @@
</form>
</div>
<script language="JavaScript" type="text/javascript">
- function open_textarea()
+ function openTextarea()
{
document.getElementById('comment_textarea').style.display = 'block';
document.getElementById('comment_div_text').style.display = 'none';
This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.
|
