diff --git a/js/src/viewer/workspacePanel.js b/js/src/viewer/workspacePanel.js
index 64c1b053bd..96c306c5e7 100644
--- a/js/src/viewer/workspacePanel.js
+++ b/js/src/viewer/workspacePanel.js
@@ -94,7 +94,13 @@
},
show: function() {
- jQuery(this.element).show({effect: "fade", duration: 160, easing: "easeInCubic"});
+ jQuery(this.element).show({
+ effect: "fade", duration: 160, easing: "easeInCubic", complete: function () {
+ // Under firefox $.show() used under display:none iframe does not change the display.
+ // This is workaround for https://github.com/IIIF/mirador/issues/929
+ jQuery(this).css('display', 'block');
+ }
+ });
},
onPanelVisible: function(_, stateValue) {
diff --git a/js/src/widgets/bookView.js b/js/src/widgets/bookView.js
index f96c5d9ef6..150afe873e 100755
--- a/js/src/widgets/bookView.js
+++ b/js/src/widgets/bookView.js
@@ -77,14 +77,14 @@
},
template: Handlebars.compile([
- '
',
- '
'
+ '',
+ '
'
].join('')),
listenForActions: function() {
var _this = this,
- firstCanvasId = _this.imagesList[0]['@id'],
- lastCanvasId = _this.imagesList[_this.imagesList.length-1]['@id'];
+ firstCanvasId = _this.imagesList[0]['@id'],
+ lastCanvasId = _this.imagesList[_this.imagesList.length-1]['@id'];
_this.eventEmitter.subscribe('bottomPanelSet.' + _this.windowId, function(event, visible) {
var dodgers = _this.element.find('.mirador-osd-toggle-bottom-panel, .mirador-pan-zoom-controls');
@@ -119,7 +119,7 @@
});
},
-bindEvents: function() {
+ bindEvents: function() {
var _this = this;
this.element.find('.mirador-osd-next').on('click', function() {
@@ -159,7 +159,7 @@ bindEvents: function() {
var osd = _this.osd;
if ( osd.viewport ) {
osd.viewport.zoomBy(
- osd.zoomPerClick / 1.0
+ osd.zoomPerClick / 1.0
);
osd.viewport.applyConstraints();
}
@@ -168,7 +168,7 @@ bindEvents: function() {
var osd = _this.osd;
if ( osd.viewport ) {
osd.viewport.zoomBy(
- 1.0 / osd.zoomPerClick
+ 1.0 / osd.zoomPerClick
);
osd.viewport.applyConstraints();
}
@@ -193,19 +193,19 @@ bindEvents: function() {
var _this = this;
this.osdOptions.osdBounds = this.osd.viewport.getBounds(true);
_this.eventEmitter.publish("imageBoundsUpdated", {
- id: _this.windowId,
- osdBounds: {
- x: _this.osdOptions.osdBounds.x,
- y: _this.osdOptions.osdBounds.y,
- width: _this.osdOptions.osdBounds.width,
- height: _this.osdOptions.osdBounds.height
- }
+ id: _this.windowId,
+ osdBounds: {
+ x: _this.osdOptions.osdBounds.x,
+ y: _this.osdOptions.osdBounds.y,
+ width: _this.osdOptions.osdBounds.width,
+ height: _this.osdOptions.osdBounds.height
+ }
});
},
toggle: function(stateValue) {
- if (stateValue) {
- this.show();
+ if (stateValue) {
+ this.show();
} else {
this.hide();
}
@@ -216,7 +216,13 @@ bindEvents: function() {
},
show: function() {
- jQuery(this.element).show({effect: "fade", duration: 300, easing: "easeInCubic"});
+ jQuery(this.element).show({
+ effect: "fade", duration: 300, easing: "easeInCubic", complete: function () {
+ // Under firefox $.show() used under display:none iframe does not change the display.
+ // This is workaround for https://github.com/IIIF/mirador/issues/929
+ jQuery(this).css('display', 'block');
+ }
+ });
},
adjustWidth: function(className, hasClass) {
@@ -241,8 +247,8 @@ bindEvents: function() {
this.currentImg = this.imagesList[this.currentImgIndex];
var newList = this.getStitchList();
var is_same = this.stitchList.length == newList.length && this.stitchList.every(function(element, index) {
- return element === newList[index];
- });
+ return element === newList[index];
+ });
if (!is_same) {
this.stitchList = newList;
this.osdOptions = {
@@ -256,19 +262,19 @@ bindEvents: function() {
createOpenSeadragonInstance: function() {
var uniqueID = $.genUUID(),
- osdId = 'mirador-osd-' + uniqueID,
- osdToolBarId = osdId + '-toolbar',
- elemOsd,
- tileSources = [],
- _this = this,
- toolbarID = 'osd-toolbar-' + uniqueID,
- dfd = jQuery.Deferred();
+ osdId = 'mirador-osd-' + uniqueID,
+ osdToolBarId = osdId + '-toolbar',
+ elemOsd,
+ tileSources = [],
+ _this = this,
+ toolbarID = 'osd-toolbar-' + uniqueID,
+ dfd = jQuery.Deferred();
this.element.find('.' + this.osdCls).remove();
jQuery.each(this.stitchList, function(index, image) {
var imageUrl = $.Iiif.getImageUrl(image),
- infoJsonUrl = imageUrl + '/info.json';
+ infoJsonUrl = imageUrl + '/info.json';
jQuery.getJSON(infoJsonUrl).done(function (data, status, jqXHR) {
tileSources.splice(index, 0, data);
@@ -280,10 +286,10 @@ bindEvents: function() {
var aspectRatio = tileSources[0].height / tileSources[0].width;
elemOsd =
- jQuery('')
- .addClass(_this.osdCls)
- .attr('id', osdId)
- .appendTo(_this.element);
+ jQuery('')
+ .addClass(_this.osdCls)
+ .attr('id', osdId)
+ .appendTo(_this.element);
_this.osd = $.OpenSeadragon({
'id': elemOsd.attr('id'),
@@ -292,8 +298,8 @@ bindEvents: function() {
if (_this.state.getStateProperty('autoHideControls')) {
var timeoutID = null,
- fadeDuration = _this.state.getStateProperty('fadeDuration'),
- timeoutDuration = _this.state.getStateProperty('timeoutDuration');
+ fadeDuration = _this.state.getStateProperty('fadeDuration'),
+ timeoutDuration = _this.state.getStateProperty('timeoutDuration');
var hideHUD = function() {
_this.element.find(".hud-control").stop(true, true).addClass('hidden', fadeDuration);
};
@@ -388,11 +394,11 @@ bindEvents: function() {
// Default to 'paged' and 'left-to-right'
// Set index(es) for any other images to stitch with selected image
var stitchList = [],
- leftIndex = [],
- rightIndex = [],
- topIndex = [],
- bottomIndex = [],
- _this = this;
+ leftIndex = [],
+ rightIndex = [],
+ topIndex = [],
+ bottomIndex = [],
+ _this = this;
this.focusImages = [];
@@ -409,20 +415,20 @@ bindEvents: function() {
switch (this.viewingDirection) {
case "left-to-right":
leftIndex[0] = this.currentImgIndex-1;
- stitchList = [this.imagesList[this.currentImgIndex-1], this.currentImg];
- break;
+ stitchList = [this.imagesList[this.currentImgIndex-1], this.currentImg];
+ break;
case "right-to-left":
rightIndex[0] = this.currentImgIndex-1;
- stitchList = [this.currentImg, this.imagesList[this.currentImgIndex-1]];
- break;
+ stitchList = [this.currentImg, this.imagesList[this.currentImgIndex-1]];
+ break;
case "top-to-bottom":
topIndex[0] = this.currentImgIndex-1;
- stitchList = [this.imagesList[this.currentImgIndex-1], this.currentImg];
- break;
+ stitchList = [this.imagesList[this.currentImgIndex-1], this.currentImg];
+ break;
case "bottom-to-top":
bottomIndex[0] = this.currentImgIndex-1;
- stitchList = [this.currentImg, this.imagesList[this.currentImgIndex-1]];
- break;
+ stitchList = [this.currentImg, this.imagesList[this.currentImgIndex-1]];
+ break;
default:
break;
}
@@ -431,20 +437,20 @@ bindEvents: function() {
switch (this.viewingDirection) {
case "left-to-right":
rightIndex[0] = this.currentImgIndex+1;
- stitchList = [this.currentImg, this.imagesList[this.currentImgIndex+1]];
- break;
+ stitchList = [this.currentImg, this.imagesList[this.currentImgIndex+1]];
+ break;
case "right-to-left":
leftIndex[0] = this.currentImgIndex+1;
- stitchList = [this.imagesList[this.currentImgIndex+1], this.currentImg];
- break;
+ stitchList = [this.imagesList[this.currentImgIndex+1], this.currentImg];
+ break;
case "top-to-bottom":
bottomIndex[0] = this.currentImgIndex+1;
- stitchList = [this.currentImg, this.imagesList[this.currentImgIndex+1]];
- break;
+ stitchList = [this.currentImg, this.imagesList[this.currentImgIndex+1]];
+ break;
case "bottom-to-top":
topIndex[0] = this.currentImgIndex+1;
- stitchList = [this.imagesList[this.currentImgIndex+1], this.currentImg];
- break;
+ stitchList = [this.imagesList[this.currentImgIndex+1], this.currentImg];
+ break;
default:
break;
}
diff --git a/js/src/widgets/imageView.js b/js/src/widgets/imageView.js
index 4fefc607b6..bbf037dedc 100755
--- a/js/src/widgets/imageView.js
+++ b/js/src/widgets/imageView.js
@@ -340,7 +340,13 @@
},
show: function() {
- jQuery(this.element).show({effect: "fade", duration: 300, easing: "easeInCubic"});
+ jQuery(this.element).show({
+ effect: "fade", duration: 300, easing: "easeInCubic", complete: function () {
+ // Under firefox $.show() used under display:none iframe does not change the display.
+ // This is workaround for https://github.com/IIIF/mirador/issues/929
+ jQuery(this).css('display', 'block');
+ }
+ });
},
adjustWidth: function(className, hasClass) {
diff --git a/js/src/widgets/thumbnailsView.js b/js/src/widgets/thumbnailsView.js
index dc1a48ff64..e76b1ec270 100755
--- a/js/src/widgets/thumbnailsView.js
+++ b/js/src/widgets/thumbnailsView.js
@@ -108,7 +108,11 @@
bindEvents: function() {
var _this = this;
_this.element.find('img').on('load', function() {
- jQuery(this).hide().fadeIn(750);
+ jQuery(this).hide().fadeIn(750,function(){
+ // Under firefox $.show() used under display:none iframe does not change the display.
+ // This is workaround for https://github.com/IIIF/mirador/issues/929
+ jQuery(this).css('display', 'block');
+ });
});
jQuery(_this.element).scroll(function() {
@@ -199,6 +203,9 @@
duration: 300,
easing: "easeInCubic",
complete: function() {
+ // Under firefox $.show() used under display:none iframe does not change the display.
+ // This is workaround for https://github.com/IIIF/mirador/issues/929
+ jQuery(this).css('display', 'block');
_this.loadImages();
}
});