|
597
|
1 /*
|
|
|
2 * digilib jQuery plugin
|
|
|
3 *
|
|
|
4 */
|
|
|
5
|
|
|
6 (function($) {
|
|
598
|
7
|
|
|
8 var defaults = {
|
|
601
|
9 // base URL to Scaler servlet
|
|
|
10 'scalerBaseUrl' : 'http://digilib.mpiwg-berlin.mpg.de/digitallibrary/servlet/Scaler',
|
|
|
11 // list of Scaler parameters
|
|
602
|
12 'scalerParamNames' : ['fn','pn','dw','dh','ww','wh','wx','wy','ws','mo',
|
|
|
13 'rot','cont','brgt','rgbm','rgba','ddpi','ddpix','ddpiy'],
|
|
601
|
14 // mode of operation.
|
|
|
15 // fullscreen: takes parameters from page URL, keeps state in page URL
|
|
|
16 // embedded: takes parameters from Javascript options, keeps state inside object
|
|
598
|
17 'interactionMode' : 'fullscreen'
|
|
|
18 };
|
|
|
19
|
|
601
|
20 // parameters from the query string
|
|
600
|
21 var queryParams = {};
|
|
601
|
22
|
|
|
23 // affine geometry classes
|
|
|
24 var geom = dlGeometry();
|
|
597
|
25
|
|
|
26 var methods = {
|
|
601
|
27 // digilib initialization
|
|
597
|
28 init : function(options) {
|
|
601
|
29 // settings for this digilib instance are merged from defaults and options
|
|
600
|
30 var settings = $.extend({}, defaults, options);
|
|
|
31 var isFullscreen = settings.interactionMode === 'fullscreen';
|
|
|
32 if (isFullscreen) {
|
|
|
33 queryParams = parseQueryParams();
|
|
|
34 };
|
|
597
|
35 return this.each(function() {
|
|
598
|
36 var $elem = $(this);
|
|
|
37 var data = $elem.data('digilib');
|
|
600
|
38 var elemSettings;
|
|
601
|
39 // if the plugin hasn't been initialized yet
|
|
597
|
40 if (!data) {
|
|
598
|
41 // merge query parameters
|
|
600
|
42 if (isFullscreen) {
|
|
|
43 elemSettings = $.extend({}, settings, queryParams);
|
|
|
44 } else {
|
|
|
45 elemSettings = $.extend({}, settings, parseImgParams($elem));
|
|
|
46 };
|
|
598
|
47 // store in data element
|
|
|
48 $elem.data('digilib', {
|
|
|
49 target : $elem,
|
|
600
|
50 settings : elemSettings
|
|
597
|
51 });
|
|
|
52 }
|
|
601
|
53 // create HTML structure
|
|
|
54 setupScalerDiv($elem, elemSettings);
|
|
597
|
55 });
|
|
|
56 },
|
|
601
|
57
|
|
|
58 // clean up digilib
|
|
597
|
59 destroy : function() {
|
|
|
60 return this.each(function(){
|
|
|
61 var $this = $(this);
|
|
|
62 var data = $this.data('digilib');
|
|
|
63 // Namespacing FTW
|
|
598
|
64 $(window).unbind('.digilib'); // unbinds all digilibs(?)
|
|
597
|
65 data.digilib.remove();
|
|
|
66 $this.removeData('digilib');
|
|
|
67 });
|
|
|
68 }
|
|
598
|
69 };
|
|
597
|
70
|
|
601
|
71 // returns parameters from page url
|
|
600
|
72 var parseQueryParams = function() {
|
|
|
73 return parseQueryString(location.search.slice(1));
|
|
|
74 };
|
|
|
75
|
|
601
|
76 // returns parameters taken from embedded img-element
|
|
600
|
77 var parseImgParams = function($elem) {
|
|
|
78 var src = $elem.children('img').attr('src');
|
|
|
79 var pos = src.indexOf('?');
|
|
|
80 var query = (pos < 0) ? '' : src.substring(pos + 1);
|
|
|
81 var scalerUrl = src.substring(0, pos);
|
|
|
82 var hash = parseQueryString(query);
|
|
602
|
83 hash.scalerBaseUrl = scalerUrl;
|
|
600
|
84 // console.log(hash);
|
|
|
85 return hash;
|
|
|
86 };
|
|
|
87
|
|
601
|
88 // parses query parameter string into parameter object
|
|
600
|
89 var parseQueryString = function(query) {
|
|
|
90 var pairs = query.split("&");
|
|
|
91 var hash = {};
|
|
|
92 for (var i = 0; i < pairs.length; i++) {
|
|
|
93 var pair = pairs[i].split("=");
|
|
|
94 if (pair.length === 2) {
|
|
601
|
95 hash[pair[0]] = pair[1];
|
|
600
|
96 };
|
|
|
97 };
|
|
|
98 return hash;
|
|
|
99 };
|
|
597
|
100
|
|
601
|
101 // returns URL and query string for Scaler
|
|
|
102 var getScalerString = function (settings) {
|
|
602
|
103 var url = settings.scalerBaseUrl + '?';
|
|
|
104 var i, parm, latter;
|
|
|
105 // go through param names and get values from settings
|
|
|
106 for (i = 0; i < settings.scalerParamNames.length; ++i) {
|
|
|
107 parm = settings.scalerParamNames[i];
|
|
|
108 if (settings[parm]) {
|
|
|
109 // first parm gets no '&'
|
|
|
110 url += latter ? '&' : '';
|
|
|
111 latter = 1;
|
|
|
112 // add parm=val
|
|
|
113 url += parm + '=' + settings[parm];
|
|
|
114 }
|
|
|
115 }
|
|
|
116 return url;
|
|
|
117 };
|
|
|
118
|
|
|
119 // returns maximum size for scaler img in fullscreen mode
|
|
|
120 var getFullscreenImgSize = function($elem) {
|
|
|
121 var winH = $(window).height();
|
|
|
122 var winW = $(window).width();
|
|
|
123 // TODO: account for borders?
|
|
|
124 return geom.size(winW, winH);
|
|
601
|
125 };
|
|
|
126
|
|
|
127 // creates HTML structure for digilib in elem
|
|
|
128 var setupScalerDiv = function ($elem, settings) {
|
|
|
129 if (settings.interactionMode === 'fullscreen') {
|
|
602
|
130 // fullscreen
|
|
|
131 var imgSize = getFullscreenImgSize($elem);
|
|
|
132 settings.dw = imgSize.width;
|
|
|
133 settings.dh = imgSize.height;
|
|
|
134 // create new html
|
|
601
|
135 $elem.empty(); // TODO: should we keep stuff for customization?
|
|
602
|
136 var scalerUrl = getScalerString(settings);
|
|
601
|
137 var scalerHTML = '<div class="scaler"><img class="pic"/></div>';
|
|
602
|
138 $elem.append(scalerHTML);
|
|
|
139 var $img = $elem.find("img.pic");
|
|
|
140 $img.attr('src', scalerUrl);
|
|
|
141 //$img.load(scalerImgLoaded);
|
|
|
142 } else {
|
|
|
143 // embedded mode -- keep inner img
|
|
|
144 var $img = $elem.detach('img');
|
|
|
145 $elem.empty(); // TODO: should we keep stuff for customization?
|
|
|
146 $img.addClass('pic');
|
|
|
147 var $scaler = $('<div class="scaler"/>');
|
|
|
148 $scaler.append($img);
|
|
|
149 $elem.append($scaler);
|
|
|
150 //$img.load(scalerImgLoaded);
|
|
601
|
151 }
|
|
|
152 };
|
|
|
153
|
|
598
|
154 // hook plugin into jquery
|
|
|
155 $.fn.digilib = function(method) {
|
|
|
156 if (methods[method]) {
|
|
|
157 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
|
|
|
158 } else if (typeof(method) === 'object' || !method) {
|
|
|
159 return methods.init.apply(this, arguments);
|
|
|
160 } else {
|
|
|
161 $.error( 'Method ' + method + ' does not exist on jQuery.digilib' );
|
|
|
162 }
|
|
|
163 };
|
|
597
|
164
|
|
|
165 })(jQuery); |
