cross browser. jslint.
[Portfolio.git] / skins / photo_film_viewer.js
index 2ebe6ca..226e6dd 100644 (file)
@@ -17,6 +17,7 @@ var DEFAULT_IMAGE_SIZES = [500, 600, 800];
 FilmSlider = function(filmBar, slider, ctxInfos, image, toolbar, breadcrumbs) {
        var thisSlider = this;
        this.filmBar = filmBar;
 FilmSlider = function(filmBar, slider, ctxInfos, image, toolbar, breadcrumbs) {
        var thisSlider = this;
        this.filmBar = filmBar;
+       this.filmBarWidth = getObjectWidth(this.filmBar);
        var film = filmBar.firstChild;
        if (film.nodeType === 3) { film = film.nextSibling; }
        this.film = film;
        var film = filmBar.firstChild;
        if (film.nodeType === 3) { film = film.nextSibling; }
        this.film = film;
@@ -78,13 +79,8 @@ FilmSlider = function(filmBar, slider, ctxInfos, image, toolbar, breadcrumbs) {
 
 
 FilmSlider.prototype.resizeSlider = function(evt) {
 
 
 FilmSlider.prototype.resizeSlider = function(evt) {
-       var filmBarWidth = getObjectWidth(this.filmBar);
-       if (!filmBarWidth) {
-               var thisSlider = this;
-               addListener(window, 'load', function(evt){thisSlider.resizeSlider(evt);});
-               return;
-       }
-       
+       var filmBarWidth = this.filmBarWidth;
+       if (!filmBarWidth) { return; }
        var filmWidth = this.slideSize * this.filmLength;
        var sliderRatio = this.sliderRatio =  filmBarWidth / filmWidth;
        var sliderWidth = filmBarWidth * sliderRatio;
        var filmWidth = this.slideSize * this.filmLength;
        var sliderRatio = this.sliderRatio =  filmBarWidth / filmWidth;
        var sliderWidth = filmBarWidth * sliderRatio;
@@ -110,6 +106,40 @@ FilmSlider.prototype.resizeSlider = function(evt) {
        }
 };
 
        }
 };
 
+FilmSlider.prototype._checkSizeAfterLoad = function(evt) {
+       this._barSizes = [];
+       this.filmBarWidth = this._barSizes[this._barSizes.length] = getObjectWidth(this.filmBar);
+       this.resizeSlider();
+       var self = this;
+       this._checkSizeIntervalId = setInterval(function(evt){self._checkSize(evt);}, 25);
+       setTimeout(function(evt){self._checkSizeStability();}, 250);
+};
+
+FilmSlider.prototype._checkSize = function(evt) {
+       this._barSizes[this._barSizes.length] = getObjectWidth(this.filmBar);
+       if (this._barSizes.length >= 2 &&
+               this._barSizes[this._barSizes.length-2] !== this._barSizes[this._barSizes.length-1]) {
+               this.filmBarWidth = this._barSizes[this._barSizes.length-1];
+               this.initialized = false;
+               this.resizeSlider();
+       }
+};
+
+FilmSlider.prototype._checkSizeStability = function(evt) {
+       var self = this;
+       var i;
+       for (i=0 ; i<this._barSizes.length - 1 ; i++) {
+               if (this._barSizes[i] !== this._barSizes[i+1]) {
+                       this._barSizes = [];
+                       setTimeout(function(evt){self._checkSizeStability();}, 250);
+                       return;
+               }
+       }
+       clearInterval(this._checkSizeIntervalId);
+       delete this._barSizes;
+       delete this._checkSizeIntervalId;
+};
+
 FilmSlider.prototype.fitToScreen = function(evt) {
        this._fitToScreen();
        var thisSlider = this;
 FilmSlider.prototype.fitToScreen = function(evt) {
        this._fitToScreen();
        var thisSlider = this;
@@ -216,6 +246,7 @@ FilmSlider.prototype.addEventListeners = function() {
        addListener(this.filmBar, 'click', function(evt){thisSlider.thumbnailClickHandler(evt);});
        addListener(this.toolbar, 'click', function(evt){thisSlider.toolbarClickHandler(evt);});
        addListener(window, 'load', function(evt){thisSlider.fitToScreen(evt);});
        addListener(this.filmBar, 'click', function(evt){thisSlider.thumbnailClickHandler(evt);});
        addListener(this.toolbar, 'click', function(evt){thisSlider.toolbarClickHandler(evt);});
        addListener(window, 'load', function(evt){thisSlider.fitToScreen(evt);});
+       addListener(window, 'load', function(evt){thisSlider._checkSizeAfterLoad(evt);});
        
        // dd listeners
        addListener(this.slider, 'mousedown', this.ddHandlers.down);
        
        // dd listeners
        addListener(this.slider, 'mousedown', this.ddHandlers.down);
@@ -573,13 +604,13 @@ FilmSlider.prototype.populateViewer = function(req) {
                                break;
                        case 'imageattributes' :
                                var link = this.buttons.back_to_portfolio.parentNode;
                                break;
                        case 'imageattributes' :
                                var link = this.buttons.back_to_portfolio.parentNode;
-                               link.href = element.getAttribute('backToContextUrl');
+                               link.href = element.getAttribute('back_to_context_url');
                                link = this.buttons.show_buyable.parentNode;
                                var buyable = element.getAttribute('buyable');
                                if(buyable === 'True') { link.className = null; }
                                else if(buyable === 'False') { link.className = 'hidden'; }
                                this.image.alt = element.getAttribute('alt');
                                link = this.buttons.show_buyable.parentNode;
                                var buyable = element.getAttribute('buyable');
                                if(buyable === 'True') { link.className = null; }
                                else if(buyable === 'False') { link.className = 'hidden'; }
                                this.image.alt = element.getAttribute('alt');
-                               this.updateBreadcrumbs(element.getAttribute('lastBcUrl'),
+                               this.updateBreadcrumbs(element.getAttribute('last_bc_url'),
                                                                           element.getAttribute('img_id'));
                                break;
                }
                                                                           element.getAttribute('img_id'));
                                break;
                }