2014-08-19 03:04:49 +04:00
|
|
|
/* globals $, App */
|
|
|
|
|
2014-07-18 03:24:28 +04:00
|
|
|
(function() {
|
|
|
|
|
2014-08-19 03:04:49 +04:00
|
|
|
window.App = {
|
2014-07-18 03:24:28 +04:00
|
|
|
init: function() {
|
|
|
|
var self = this;
|
|
|
|
|
2014-10-30 03:14:46 +03:00
|
|
|
var tileSources = [
|
|
|
|
{
|
|
|
|
tileSource: "../../data/tall.dzi",
|
|
|
|
x: 1.5,
|
|
|
|
y: 0,
|
|
|
|
width: 1
|
|
|
|
}, {
|
|
|
|
tileSource: '../../data/wide.dzi',
|
|
|
|
opacity: 1,
|
|
|
|
x: 0,
|
|
|
|
y: 1.5,
|
|
|
|
height: 1
|
|
|
|
}
|
|
|
|
];
|
|
|
|
|
2014-07-18 03:24:28 +04:00
|
|
|
this.viewer = OpenSeadragon( {
|
2014-10-30 02:11:21 +03:00
|
|
|
// debugMode: true,
|
2014-07-22 22:13:22 +04:00
|
|
|
zoomPerScroll: 1.02,
|
2014-09-24 03:15:03 +04:00
|
|
|
showNavigator: true,
|
2014-07-18 03:24:28 +04:00
|
|
|
id: "contentDiv",
|
2014-10-30 03:14:46 +03:00
|
|
|
tileSources: tileSources,
|
2014-11-04 04:14:17 +03:00
|
|
|
prefixUrl: "../../../build/openseadragon/images/",
|
|
|
|
overlays: [ {
|
|
|
|
px: 13,
|
|
|
|
py: 120,
|
|
|
|
width: 124,
|
|
|
|
height: 132,
|
|
|
|
id: "overlay"
|
|
|
|
}, {
|
|
|
|
px: 400,
|
|
|
|
py: 500,
|
|
|
|
width: 400,
|
|
|
|
height: 400,
|
|
|
|
id: "fixed-overlay",
|
|
|
|
placement: "TOP_LEFT"
|
|
|
|
} ]
|
2014-07-18 03:24:28 +04:00
|
|
|
} );
|
|
|
|
|
2014-11-04 04:14:17 +03:00
|
|
|
this.viewer.addHandler( "open", function() {
|
|
|
|
// console.log(self.viewer.viewport.contentSize);
|
|
|
|
});
|
|
|
|
|
2014-10-30 03:14:46 +03:00
|
|
|
// this.crossTest3();
|
2014-08-27 02:27:55 +04:00
|
|
|
},
|
|
|
|
|
|
|
|
// ----------
|
|
|
|
crossTest: function() {
|
|
|
|
var self = this;
|
|
|
|
|
2014-07-18 03:24:28 +04:00
|
|
|
this.viewer.addHandler( "open", function() {
|
2014-08-27 02:27:55 +04:00
|
|
|
var options = {
|
|
|
|
tileSource: '../../data/wide.dzi',
|
|
|
|
opacity: 1,
|
|
|
|
x: 0,
|
|
|
|
y: 1.5,
|
|
|
|
height: 1
|
|
|
|
};
|
|
|
|
|
|
|
|
var addItemHandler = function( event ) {
|
|
|
|
if ( event.options === options ) {
|
|
|
|
self.viewer.world.removeHandler( "add-item", addItemHandler );
|
|
|
|
self.viewer.viewport.goHome();
|
|
|
|
}
|
|
|
|
};
|
|
|
|
self.viewer.world.addHandler( "add-item", addItemHandler );
|
|
|
|
self.viewer.addTiledImage( options );
|
2014-07-18 03:24:28 +04:00
|
|
|
});
|
2014-07-22 22:13:22 +04:00
|
|
|
|
|
|
|
this.viewer.open("../../data/tall.dzi", {
|
|
|
|
x: 1.5,
|
|
|
|
y: 0,
|
2014-08-01 02:54:20 +04:00
|
|
|
width: 1
|
2014-07-22 22:13:22 +04:00
|
|
|
});
|
2014-07-18 03:24:28 +04:00
|
|
|
},
|
|
|
|
|
2014-10-30 02:11:21 +03:00
|
|
|
// ----------
|
|
|
|
crossTest2: function() {
|
|
|
|
this.viewer.open([
|
|
|
|
{
|
|
|
|
tileSource: "../../data/tall.dzi",
|
|
|
|
x: 1.5,
|
|
|
|
y: 0,
|
|
|
|
width: 1
|
|
|
|
}, {
|
|
|
|
tileSource: '../../data/wide.dzi',
|
|
|
|
opacity: 1,
|
|
|
|
x: 0,
|
|
|
|
y: 1.5,
|
|
|
|
height: 1
|
|
|
|
}
|
|
|
|
]);
|
|
|
|
},
|
|
|
|
|
|
|
|
// ----------
|
|
|
|
crossTest3: function() {
|
|
|
|
var self = this;
|
|
|
|
var expected = 2;
|
|
|
|
var loaded = 0;
|
|
|
|
|
|
|
|
this.viewer.world.addHandler('add-item', function() {
|
|
|
|
loaded++;
|
|
|
|
if (loaded === expected) {
|
|
|
|
// self.viewer.viewport.goHome();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
this.viewer.addTiledImage({
|
|
|
|
tileSource: "../../data/tall.dzi",
|
|
|
|
x: 1.5,
|
|
|
|
y: 0,
|
|
|
|
width: 1
|
|
|
|
});
|
|
|
|
|
|
|
|
this.viewer.addTiledImage({
|
|
|
|
tileSource: '../../data/wide.dzi',
|
|
|
|
opacity: 1,
|
|
|
|
x: 0,
|
|
|
|
y: 1.5,
|
|
|
|
height: 1
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
2014-07-18 03:24:28 +04:00
|
|
|
// ----------
|
2014-08-27 02:27:55 +04:00
|
|
|
gridTest: function() {
|
2014-07-18 03:24:28 +04:00
|
|
|
var self = this;
|
2014-08-27 02:27:55 +04:00
|
|
|
var startX = -3;
|
|
|
|
var expected = 0;
|
|
|
|
var loaded = 0;
|
|
|
|
|
|
|
|
this.viewer.addHandler( "open", function() {
|
|
|
|
self.viewer.world.addHandler('add-item', function() {
|
|
|
|
loaded++;
|
|
|
|
if (loaded === expected) {
|
|
|
|
self.viewer.viewport.goHome();
|
|
|
|
}
|
|
|
|
});
|
2014-07-18 03:24:28 +04:00
|
|
|
|
2014-08-27 02:27:55 +04:00
|
|
|
var x, y;
|
|
|
|
for (y = 0; y < 6; y++) {
|
|
|
|
for (x = 0; x < 6; x++) {
|
|
|
|
if (!x && !y) {
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
|
|
|
|
var options = {
|
|
|
|
tileSource: '../../data/testpattern.dzi',
|
|
|
|
x: startX + x,
|
|
|
|
y: y,
|
|
|
|
width: 1
|
|
|
|
};
|
|
|
|
|
|
|
|
expected++;
|
|
|
|
self.viewer.addTiledImage( options );
|
|
|
|
}
|
2014-07-18 03:24:28 +04:00
|
|
|
}
|
2014-08-27 02:27:55 +04:00
|
|
|
});
|
|
|
|
|
|
|
|
this.viewer.open("../../data/testpattern.dzi", {
|
|
|
|
x: startX,
|
|
|
|
y: 0,
|
|
|
|
width: 1
|
|
|
|
});
|
2014-09-24 03:15:03 +04:00
|
|
|
},
|
|
|
|
|
|
|
|
// ----------
|
|
|
|
bigTest: function() {
|
|
|
|
this.viewer.open("../../data/testpattern.dzi", {
|
|
|
|
x: -2,
|
|
|
|
y: -2,
|
|
|
|
width: 6
|
|
|
|
});
|
2014-07-18 03:24:28 +04:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
App.init();
|
|
|
|
});
|
|
|
|
|
|
|
|
})();
|