From b28da5acd20f0d611ecd7fae9ed6942c239adda6 Mon Sep 17 00:00:00 2001
From: Eugene Crosser <crosser@average.org>
Date: Mon, 25 Aug 2008 14:18:48 +0000
Subject: [PATCH] make links, nice style, etc.
---
include/gallery.css | 25 +++++++++++++++++--------
include/gallery.js | 20 +++++---------------
include/slideshow.js | 22 ++++++++++++++++++----
mkgallery.pl | 2 +-
4 files changed, 41 insertions(+), 28 deletions(-)
diff --git a/include/gallery.css b/include/gallery.css
index 8503ddf..edfa12d 100644
--- a/include/gallery.css
+++ b/include/gallery.css
@@ -105,38 +105,47 @@ table.picframe {
}
.controlButton#prev {
- left: 0px;
+ left: 3px;
background: url(left.png) no-repeat;
}
.controlButton#stop {
- left: 25px;
+ left: 28px;
background: url(stop.png) no-repeat;
}
.controlButton#play {
- left: 50px;
+ left: 53px;
background: url(play.png) no-repeat;
}
.controlButton#next {
- left: 75px;
+ left: 78px;
background: url(right.png) no-repeat;
}
.controlButton#exit {
- left: 100px;
+ left: 103px;
background: url(close.png) no-repeat;
}
.controlButton#comm {
- left: 125px;
+ left: 128px;
width: auto;
- color: white;
- margin: .3ex;
+ font-size: 20px;
+ margin-left: .5ex;
+ margin-right: .5ex;
+ padding-left: .5ex;
+ padding-right: .5ex;
+ background-color: rgba(0,0,0,.5);
cursor: default;
}
+.controlButton#comm a {
+ color: white;
+ text-decoration: none;
+}
+
.MultiBoxContainer {
position: absolute;
border: 2px solid #000;
diff --git a/include/gallery.js b/include/gallery.js
index 445a826..3dcc3c2 100644
--- a/include/gallery.js
+++ b/include/gallery.js
@@ -103,14 +103,6 @@ var showControls = new Class({
var buttons = ['prev','stop','play','next','exit','comm']
buttons.each(function(el){
var sub = new Element('div')
- if (el == 'comm') {
- this.comm = sub
- sub.set('text', 'this is a comment field')
- /*
- } else {
- sub.set('text', el)
- */
- }
if (this.options[el]) {
sub.addEvent('click', function() {
this.options[el]()
@@ -123,15 +115,12 @@ var showControls = new Class({
},this)
},
- settext: function(text) {
- this.comm.set(text)
- }
})
showControls.implement(new Options)
/* Make overlay window and start slideshow */
function showImage(id,doplay) {
- var i=rimgs[id][0]
+ var i=rimgs[id]
/* alert('show id='+id+' index='+i+' doplay='+doplay) */
showwin.show()
show.play(i)
@@ -200,13 +189,13 @@ function init_gallery() {
el.addEvent('click', showImage.bind(el,[el.get('id'),0]))
})
$$('div.varimages').each(function(el,i){
- rimgs[el.id] = [i, el.title]
+ rimgs[el.id] = i
vimgs[i] = []
el.getElements('a').each(function(ael,j){
dim = /(\d+)[^\d](\d+)/.exec(ael.text)
w = dim[1]
h = dim[2]
- vimgs[i][j]=[w,h,ael.href]
+ vimgs[i][j]=[w,h,ael.href,el.id,el.title]
})
})
/* debugging output
@@ -246,7 +235,8 @@ function init_gallery() {
duration: 1000,
loop: false,
thumbnails: false,
- onClick: function(i){alert(i)}
+ onClick: function(i){alert(i)},
+ comment: 'comm',
}
show = new slideShow('slideshowContainer',vimgs,showparms)
diff --git a/include/slideshow.js b/include/slideshow.js
index 2de9fee..5d648c8 100644
--- a/include/slideshow.js
+++ b/include/slideshow.js
@@ -24,7 +24,8 @@ var slideShow = new Class({
thumbnailCls: 'outline',
backgroundSlider: false, //change to be an instance.
loadingCls: 'loading',
- onClick: false
+ onClick: false,
+ comment: null,
};
},
@@ -41,8 +42,8 @@ var slideShow = new Class({
this.options.onClick(this.imageLoaded);
}.bind(this));
}
-
-
+ this.comm=this.options.comment;
+
this.imagesHolder = new Element('div').setStyles({
position: 'absolute',
overflow: 'hidden',
@@ -161,7 +162,8 @@ var slideShow = new Class({
this.imageObj = new Asset.image(img, {onload: this.show.bind(this)});
this.imageObj.set('width', width).set('height', height);
}
-
+ this.imageObj.set('id', this.images[this.image][i][3]);
+ this.imageObj.set('title', this.images[this.image][i][4]);
},
restyle: function(imgobj){
@@ -217,6 +219,15 @@ var slideShow = new Class({
this.imageLoaded = this.image;
this.loading.setStyle('display','none');
this.effect();
+ this.comm = $(this.comm);
+ if (this.comm) {
+ var a = this.comm.getElement('a');
+ if (a) a.dispose();
+ a = new Element('a', {
+ href: '#'+this.imageObj.get('id'),
+ html: this.imageObj.get('title'),
+ }).injectInside(this.comm);
+ }
},
wait: function(){
@@ -437,6 +448,9 @@ var slideShow = new Class({
resetAnimation: function(){
this.animating = false;
+ this.oldImage.setStyles({
+ opacity: 0
+ });
},
position: function(){
diff --git a/mkgallery.pl b/mkgallery.pl
index 0c13f23..d5473c1 100755
--- a/mkgallery.pl
+++ b/mkgallery.pl
@@ -671,7 +671,7 @@ sub img_entry {
-class=>'showImage',
-id=>$name},
img({-src=>$thumb})),"\n"),"\n",
- start_div({-class=>'varimages',-id=>$name,-name=>$title}),"\n";
+ start_div({-class=>'varimages',-id=>$name,-title=>$title}),"\n";
foreach my $sz(@sizes) {
my $src=$self->{$sz}->{'url'};
my $w=$self->{$sz}->{'dim'}->[0];
--
2.43.0