gray out inactive controls

diff --git a/include/controls.js b/include/controls.js
index 4aa3002535870253f2d29a0484e12c1eeac0e1e8..53a060f9765dbfcbefd0c9e24bcca2a2768ec501 100644 (file)
--- a/include/controls.js
+++ b/include/controls.js
@@ -28,7 +28,6 @@ var Controls = new Class({
                        onClick: $empty,
                        zIndex: 3,
                        buttonClass: 'controlButton',
-                       buttons: ['prev','stop','play','next','exit','comm'],
                }
        },
 
@@ -44,7 +43,8 @@ var Controls = new Class({
                }).addEvent('click', function(){
                        this.options.onClick()
                }.bind(this)).injectInside(this.parent);
-               this.options.buttons.each(function(el){
+               var buttons = ['prev','stop','play','next','exit','comm'];
+               buttons.each(function(el){
                        var sub = new Element('div');
                        sub.addClass(this.options.buttonClass).setProperties({
                                id: el,
@@ -72,6 +72,7 @@ var Controls = new Class({
        },
 
        prev: function(){
+               if (this.prevdisabled) { return; }
                if (this.show.prev) { this.show.prev() }
                else { alert('no method for "prev", file complaint with UN') }
        },
@@ -87,6 +88,7 @@ var Controls = new Class({
        },
 
        next: function(){
+               if (this.nextdisabled) { return; }
                if (this.show.next) { this.show.next() }
                else { alert('no method for "next", file complaint with UN') }
        },
@@ -102,10 +104,24 @@ var Controls = new Class({
        },
 
        info: function(pos, max, ref, txt){
-               var msg = 'pos='+pos+', max='+max+', ref='+ref+', txt='+txt;
+               var p1 = pos + 1;
                this.refbox.set('html',txt);
                this.refbox.set('href',ref);
-               this.posbox.set('text',pos+' of '+max);
+               this.posbox.set('text',p1+' of '+max);
+               if (p1 < 2) {
+                       this.prevbox.set('id', 'prevDisabled');
+                       this.prevdisabled = true;
+               } else {
+                       this.prevbox.set('id', 'prev');
+                       this.prevdisabled = false;
+               }
+               if (p1 >= max) {
+                       this.nextbox.set('id', 'nextDisabled');
+                       this.nextdisabled = true;
+               } else {
+                       this.nextbox.set('id', 'next');
+                       this.nextdisabled = false;
+               }
        },
 
        running: function(isrunning){

diff --git a/include/gallery.css b/include/gallery.css
index 0a8c92807a31cfeb2098d1a982b67d14aa4d5fca..e06e65af103a62f38f46680a75ae6e804e7e2981 100644 (file)
--- a/include/gallery.css
+++ b/include/gallery.css
@@ -112,6 +112,12 @@ table.picframe {
  background: url(left.png) no-repeat;
 }
 
+.controlButton#prevDisabled {
+ left: 3px;
+ background: url(leftDisabled.png) no-repeat;
+ cursor: default;
+}
+
 .controlButton#stop {
  left: 28px;
  background: url(stop.png) no-repeat;
@@ -127,6 +133,12 @@ table.picframe {
  background: url(right.png) no-repeat;
 }
 
+.controlButton#nextDisabled {
+ left: 53px;
+ background: url(rightDisabled.png) no-repeat;
+ cursor: default;
+}
+
 .controlButton#exit {
  left: 78px;
  background: url(close.png) no-repeat;
@@ -145,9 +157,16 @@ table.picframe {
 }
 
 .controlButton#comm a {
+ color: white;
  text-decoration: none;
 }
 
+.controlPosition {
+ vertical-align: middle;
+ font-size: 10px;
+ margin-right: 1ex;
+}
+
 .MultiBoxContainer {
        position: absolute;
        border: 2px solid #000;