Mercurial > hg > digilib-old
annotate webapp/src/main/webapp/jquery/jquery.digilib.regions.js @ 1096:3c75dda660bf
more refactoring: use jquery selections instead of arrays
author | hertzhaft |
---|---|
date | Tue, 23 Oct 2012 23:20:45 +0200 |
parents | 20ad0034f1e5 |
children | f677b9ac5110 |
rev | line source |
---|---|
792 | 1 /** optional digilib regions plugin |
2 | |
1023 | 3 Mark up a digilib image with rectangular regions. |
4 | |
5 If hasRegionInfo=true reads regions from page HTML. | |
6 Element with regions has to be in digilib element, e.g. | |
792 | 7 |
1025 | 8 <map class="dl-keep dl-regioncontent"> |
9 <area href="http://www.mpiwg-berlin.mpg.de" coords="0.1,0.1,0.4,0.1" alt="MPI fuer Wissenschaftsgeschichte"/> | |
10 <area href="http://www.biblhertz.it" coords="0.5,0.8,0.4,0.1" alt="Bibliotheca Hertziana"/> | |
11 <area coords="0.3,0.5,0.15,0.1" /> | |
12 </map> | |
1023 | 13 |
1067 | 14 According to the HTML specs, "area" and "a" elements are allowed inside of a "map". |
15 Both can have a "coords" attribute, but "area" elements can't contain child nodes. | |
16 To have regions with content use "a" tags, e.g. | |
17 | |
18 <map class="dl-keep dl-regioncontent"> | |
19 <a href="http://www.mpiwg-berlin.mpg.de" coords="0.4907,0.3521,0.1458,0.107"> | |
20 MPI fuer Wissenschaftsgeschichte | |
21 </a> | |
22 <a href="http://www.biblhertz.it" coords="0.3413,0.2912,0.4345,0.2945"> | |
23 Bibliotheca Hertziana | |
24 </a> | |
25 <area coords="0.3,0.5,0.15,0.1" /> | |
26 </map> | |
27 | |
792 | 28 */ |
29 | |
30 (function($) { | |
813 | 31 // the digilib object |
996 | 32 var digilib = null; |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
33 // the normal zoom area |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
34 var FULL_AREA = null; |
813 | 35 // the functions made available by digilib |
1048 | 36 var fn = { |
37 // dummy function to avoid errors, gets overwritten by buttons plugin | |
38 highlightButtons : function () { | |
39 console.debug('regions: dummy function - highlightButtons'); | |
40 } | |
41 }; | |
813 | 42 // affine geometry plugin |
996 | 43 var geom = null; |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
44 |
792 | 45 var buttons = { |
1091 | 46 defineregion : { |
47 onclick : "defineUserRegion", | |
813 | 48 tooltip : "define a region", |
792 | 49 icon : "addregion.png" |
50 }, | |
1091 | 51 removeregion : { |
52 onclick : "removeUserRegion", | |
53 tooltip : "delete the last user defined region", | |
792 | 54 icon : "delregion.png" |
55 }, | |
1091 | 56 removeallregions : { |
57 onclick : "removeAllUserRegions", | |
58 tooltip : "delete all user defined regions", | |
1067 | 59 icon : "delallregions.png" |
60 }, | |
792 | 61 regions : { |
62 onclick : "toggleRegions", | |
63 tooltip : "show or hide regions", | |
64 icon : "regions.png" | |
65 }, | |
1092 | 66 findcoords : { |
67 onclick : "findCoords", | |
68 tooltip : "find coords and display as a new region", | |
69 icon : "regions.png" | |
70 }, | |
1048 | 71 regioninfo : { |
855 | 72 onclick : "showRegionInfo", |
1091 | 73 tooltip : "show information about user defined regions", |
792 | 74 icon : "regioninfo.png" |
75 } | |
76 }; | |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
77 |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
78 var defaults = { |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
79 // are regions being edited? |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
80 'editRegions' : false, |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
81 // are regions shown? |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
82 'isRegionVisible' : true, |
813 | 83 // are region numbers shown? |
1023 | 84 'showRegionNumbers' : true, |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
85 // default width for region when only point is given |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
86 'regionWidth' : 0.005, |
850
47a6b93bde43
always show html-defined regions. wrong pos still not fixed
hertzhaft
parents:
848
diff
changeset
|
87 // is there region content in the page? |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
88 'processHtmlRegions' : false, |
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
89 // region defined by users and in the URL |
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
90 'processUserRegions' : true, |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
91 // callback for click on region |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
92 'onClickRegion' : null, |
1091 | 93 // callback when new user region is defined |
94 'onNewRegion' : null, | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
95 // turn any region into a clickable link to its detail view (DEPRECATED) |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
96 'autoZoomOnClick' : false, |
1091 | 97 // css selector for area/a elements (must also be marked with class "dl-keep") |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
98 'areaSelector' : 'map.dl-regioncontent area, map.dl-regioncontent a', |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
99 // buttonset of this plugin |
1092 | 100 'regionSet' : ['regions', 'defineregion', 'removeregion', 'removeallregions', 'regioninfo', 'findcoords', 'lessoptions'], |
813 | 101 // url param for regions |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
102 'rg' : null, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
103 // region attributes to copy from HTML |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
104 'regionAttributes' : { |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
105 'id' :1, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
106 'href' :1, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
107 'title' :1, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
108 'target':1, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
109 'style' :1, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
110 'class' :1 |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
111 } |
813 | 112 }; |
792 | 113 |
114 var actions = { | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
115 |
792 | 116 // define a region interactively with two clicked points |
1091 | 117 defineUserRegion : function(data) { |
813 | 118 if (!data.settings.isRegionVisible) { |
119 alert("Please turn on regions visibility!"); | |
120 return; | |
121 } | |
996 | 122 var cssPrefix = data.settings.cssPrefix; |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
123 var $elem = data.$elem; |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
124 var $body = $('body'); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
125 var bodyRect = geom.rectangle($body); |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
126 var $scaler = data.$scaler; |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
127 var scalerRect = geom.rectangle($scaler); |
792 | 128 var pt1, pt2; |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
129 // overlay prevents other elements from reacting to mouse events |
996 | 130 var $overlay = $('<div class="'+cssPrefix+'overlay" style="position:absolute"/>'); |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
131 $body.append($overlay); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
132 bodyRect.adjustDiv($overlay); |
1095 | 133 var $regionDiv = newRegionDiv(data); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
134 addRegionAttributes(data, $regionDiv, {'class' : cssPrefix+"regionURL"}); |
792 | 135 |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
136 // mousedown handler: start sizing |
792 | 137 var regionStart = function (evt) { |
138 pt1 = geom.position(evt); | |
139 // setup and show zoom div | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
140 pt1.adjustDiv($regionDiv); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
141 $regionDiv.width(0).height(0); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
142 $regionDiv.show(); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
143 // register mouse events |
920 | 144 $overlay.on("mousemove.dlRegion", regionMove); |
145 $overlay.on("mouseup.dlRegion", regionEnd); | |
792 | 146 return false; |
147 }; | |
148 | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
149 // mousemove handler: size region |
792 | 150 var regionMove = function (evt) { |
151 pt2 = geom.position(evt); | |
152 var rect = geom.rectangle(pt1, pt2); | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
153 rect.clipTo(scalerRect); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
154 // update region |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
155 rect.adjustDiv($regionDiv); |
792 | 156 return false; |
157 }; | |
158 | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
159 // mouseup handler: end sizing |
792 | 160 var regionEnd = function (evt) { |
161 pt2 = geom.position(evt); | |
162 // assume a click and continue if the area is too small | |
163 var clickRect = geom.rectangle(pt1, pt2); | |
164 if (clickRect.getArea() <= 5) return false; | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
165 // unregister mouse events and get rid of overlay |
920 | 166 $overlay.off("mousemove.dlRegion", regionMove); |
167 $overlay.off("mouseup.dlRegion", regionEnd); | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
168 $overlay.remove(); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
169 // clip region |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
170 clickRect.clipTo(scalerRect); |
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
171 clickRect.adjustDiv($regionDiv); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
172 regionTrafo(data, $regionDiv); |
1091 | 173 fn.highlightButtons(data, 'defineregion', 0); |
813 | 174 redisplay(data); |
1095 | 175 $(data).trigger('newRegion', [$regionDiv]); |
792 | 176 return false; |
177 }; | |
178 | |
179 // bind start zoom handler | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
180 $overlay.one('mousedown.dlRegion', regionStart); |
1091 | 181 fn.highlightButtons(data, 'defineregion', 1); |
792 | 182 }, |
183 | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
184 // remove the last added URL region |
1091 | 185 removeUserRegion : function (data) { |
813 | 186 if (!data.settings.isRegionVisible) { |
187 alert("Please turn on regions visibility!"); | |
188 return; | |
189 } | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
190 var selector = 'div.'+data.settings.cssPrefix+'regionURL'; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
191 var $regionDiv = data.$elem.find(selector).last(); |
792 | 192 $regionDiv.remove(); |
813 | 193 redisplay(data); |
792 | 194 }, |
195 | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
196 // remove all manually added regions (defined through URL "rg" parameter) |
1091 | 197 removeAllUserRegions : function (data) { |
1067 | 198 if (!data.settings.isRegionVisible) { |
199 alert("Please turn on regions visibility!"); | |
200 return; | |
201 } | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
202 var selector = 'div.'+data.settings.cssPrefix+'regionURL'; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
203 var $regionDivs = data.$elem.find(selector); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
204 $regionDivs.remove(); |
1067 | 205 redisplay(data); |
206 }, | |
207 | |
813 | 208 // show/hide regions |
1060 | 209 toggleRegions : function (data) { |
813 | 210 var show = !data.settings.isRegionVisible; |
211 data.settings.isRegionVisible = show; | |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
212 fn.highlightButtons(data, 'regions', show); |
850
47a6b93bde43
always show html-defined regions. wrong pos still not fixed
hertzhaft
parents:
848
diff
changeset
|
213 renderRegions(data, 1); |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
214 }, |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
215 |
1048 | 216 // show region info in a window |
1060 | 217 showRegionInfo : function (data) { |
1048 | 218 var $elem = data.$elem; |
219 var cssPrefix = data.settings.cssPrefix; | |
1060 | 220 var infoselector = '#'+cssPrefix+'regionInfo'; |
221 if (fn.find(data, infoselector)) { | |
1048 | 222 fn.withdraw($info); |
223 return; | |
224 } | |
225 var html = '\ | |
226 <div id="'+cssPrefix+'regionInfo" class="'+cssPrefix+'keep '+cssPrefix+'regionInfo">\ | |
1060 | 227 <table class="'+cssPrefix+'infoheader">\ |
228 <tr>\ | |
229 <td class="'+cssPrefix+'infobutton html">HTML</td>\ | |
230 <td class="'+cssPrefix+'infobutton svgattr">SVG</td>\ | |
231 <td class="'+cssPrefix+'infobutton csv">CSV</td>\ | |
232 <td class="'+cssPrefix+'infobutton digilib">Digilib</td>\ | |
233 <td class="'+cssPrefix+'infobutton x">X</td>\ | |
234 </tr>\ | |
235 </table>\ | |
1048 | 236 </div>'; |
237 $info = $(html); | |
238 $info.appendTo($elem); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
239 var $regions = getRegions(data, 'regionURL'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
240 $info.append(regionInfoHTML(data, $regions)); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
241 $info.append(regionInfoSVG(data, $regions)); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
242 $info.append(regionInfoCSV(data, $regions)); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
243 $info.append(regionInfoDigilib(data, $regions)); |
1048 | 244 var bind = function(name) { |
1060 | 245 $info.find('.'+name).on('click.regioninfo', function () { |
1048 | 246 $info.find('div.'+cssPrefix+'info').hide(); |
247 $info.find('div.'+cssPrefix+name).show(); | |
1060 | 248 fn.centerOnScreen(data, $info); |
832
e4133946a9ad
display regions as HTML for use in digilib element
hertzhaft
parents:
824
diff
changeset
|
249 }); |
1048 | 250 }; |
251 bind('html'); | |
252 bind('svgattr'); | |
1060 | 253 bind('csv'); |
1048 | 254 bind('digilib'); |
255 $info.find('.x').on('click.regioninfo', function () { | |
256 fn.withdraw($info); | |
257 }); | |
258 $info.fadeIn(); | |
1060 | 259 fn.centerOnScreen(data, $info); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
260 }, |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
261 |
1091 | 262 // display region coordinates in an edit line |
1095 | 263 showRegionCoords : function (data, $regionDiv) { |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
264 var $elem = data.$elem; |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
265 var cssPrefix = data.settings.cssPrefix; |
1095 | 266 var rect = $regionDiv.data('rect'); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
267 var text = $regionDiv.data('text'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
268 var coordString = packCoords(rect, ','); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
269 var html = '\ |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
270 <div id="'+cssPrefix+'regionInfo" class="'+cssPrefix+'keep '+cssPrefix+'regionInfo">\ |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
271 <div/>\ |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
272 <input name="coords" type="text" size="30" maxlength="40" value="'+coordString+'"/>\ |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
273 </div>'; |
1091 | 274 var $info = $(html); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
275 $info.appendTo($elem); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
276 $div = $info.find('div'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
277 $div.text(text); |
1091 | 278 $input = $info.find('input'); |
279 $input.on('focus.regioninfo', function (event) { | |
280 this.select(); | |
281 }); | |
282 $input.on('blur.regioninfo', function (event) { | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
283 fn.withdraw($info); |
1091 | 284 return false; |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
285 }); |
1091 | 286 $input.on('keypress.regioninfo', function (event) { |
1092 | 287 fn.withdraw($info); // OBS: "return false" disables copy! |
1091 | 288 }); |
289 $input.prop("readonly",true); | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
290 $info.fadeIn(); |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
291 fn.centerOnScreen(data, $info); |
1091 | 292 $input.focus(); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
293 console.debug('showRegionCoords', coordString); |
1092 | 294 }, |
1091 | 295 |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
296 // draw a find region from coords and move into view |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
297 regionFromCoords : function (data, coords) { |
1095 | 298 var rect = parseCoords(data, coords); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
299 if (rect == null) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
300 alert('invalid coordinates: ' + coords); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
301 return; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
302 } |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
303 var cssPrefix = data.settings.cssPrefix; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
304 var attr = { 'class' : cssPrefix+'regionURL '+cssPrefix+'findregion' }; |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
305 addRegionDiv(data, rect, attr); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
306 var za = data.zoomArea; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
307 if (!fn.isFullArea(za)) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
308 za.setCenter(rect.getCenter()).stayInside(FULL_AREA); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
309 if (!za.containsRect(rect)) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
310 za = FULL_AREA.copy(); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
311 } |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
312 fn.setZoomArea(data, za); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
313 } |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
314 console.debug('regionFromCoords', coords, rect, za); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
315 redisplay(data); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
316 }, |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
317 |
1092 | 318 // find coordinates and display as new region |
319 findCoords : function (data) { | |
320 var $elem = data.$elem; | |
321 var cssPrefix = data.settings.cssPrefix; | |
322 var html = '\ | |
323 <div id="'+cssPrefix+'regionInfo" class="'+cssPrefix+'keep '+cssPrefix+'regionInfo">\ | |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
324 <div>coordinates to find:</div>\ |
1092 | 325 <form class="'+cssPrefix+'form">\ |
326 <div>\ | |
327 <input class="'+cssPrefix+'input" name="coords" type="text" size="30" maxlength="40"/> \ | |
328 </div>\ | |
329 <input class="'+cssPrefix+'submit" type="submit" name="sub" value="Ok"/>\ | |
330 <input class="'+cssPrefix+'cancel" type="button" value="Cancel"/>\ | |
331 </form>\ | |
332 </div>'; | |
333 var $info = $(html); | |
334 $info.appendTo($elem); | |
335 var $form = $info.find('form'); | |
336 var $input = $info.find('input.'+cssPrefix+'input'); | |
337 // handle submit | |
338 $form.on('submit', function () { | |
339 var coords = $input.val(); | |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
340 actions.regionFromCoords(data, coords); |
1092 | 341 fn.withdraw($info); |
342 return false; | |
343 }); | |
344 // handle cancel | |
345 $form.find('.'+cssPrefix+'cancel').on('click', function () { | |
346 fn.withdraw($info); | |
347 }); | |
348 $info.fadeIn(); | |
349 fn.centerOnScreen(data, $info); | |
350 $input.focus(); | |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
351 } |
792 | 352 }; |
353 | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
354 // make a coords string |
1095 | 355 var packCoords = function (rect, sep) { |
1091 | 356 if (sep == null) sep = ','; // comma as default separator |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
357 return [ |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
358 fn.cropFloatStr(rect.x), |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
359 fn.cropFloatStr(rect.y), |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
360 fn.cropFloatStr(rect.width), |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
361 fn.cropFloatStr(rect.height) |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
362 ].join(sep); |
813 | 363 }; |
364 | |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
365 // create a rectangle from a coords string |
1095 | 366 var parseCoords = function (data, coords) { |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
367 var pos = coords.match(/[0-9.]+/g); // TODO: check validity? |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
368 if (pos == null) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
369 return null; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
370 } |
1092 | 371 var rect = geom.rectangle(pos[0], pos[1], pos[2], pos[3]); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
372 if (!fn.isNumber(rect.x) || !fn.isNumber(rect.y)) { |
1092 | 373 return null; |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
374 } |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
375 if (!rect.getArea()) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
376 var pt = rect.getPosition(); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
377 rect.width = data.settings.regionWidth; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
378 rect.height = rect.width; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
379 rect.setCenter(pt); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
380 } |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
381 return rect; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
382 }; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
383 |
1095 | 384 // create a new regionDiv and add it to data.$elem |
385 var newRegionDiv = function (data) { | |
386 var settings = data.settings; | |
387 var cssPrefix = settings.cssPrefix; | |
388 var cls = cssPrefix+'region '+cssPrefix+'overlay'; | |
389 var $regionDiv = $('<div class="'+cls+'" style="display:none"/>'); | |
390 data.$elem.append($regionDiv); | |
391 return $regionDiv; | |
392 }; | |
393 | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
394 // calculate the digilib coordinates of a completed user-defined region |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
395 var regionTrafo = function (data, $regionDiv) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
396 var screenRect = geom.rectangle($regionDiv); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
397 var rect = data.imgTrafo.invtransform(screenRect); |
1095 | 398 $regionDiv.data('rect', rect); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
399 console.debug("regionTrafo", $regionDiv, rect); |
1095 | 400 return rect; |
401 }; | |
402 | |
403 // copy attributes to a region div | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
404 var addRegionAttributes = function (data, $regionDiv, attributes) { |
1095 | 405 if (attributes == null) return; |
406 var settings = data.settings; | |
407 var cssPrefix = settings.cssPrefix; | |
408 if (attributes['class']) { | |
409 $regionDiv.addClass(attributes['class']); | |
410 delete attributes['class']; | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
411 } |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
412 if (attributes['href']) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
413 $regionDiv.data('href', attributes['href']); // TODO: href from HTML? |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
414 delete attributes['href']; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
415 } |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
416 if (attributes['title']) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
417 $regionDiv.data('text', attributes['title']); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
418 } |
1095 | 419 $regionDiv.attr(attributes); |
420 }; | |
421 | |
422 // set region number | |
423 var addRegionNumber = function (data, $regionDiv, index) { | |
424 var settings = data.settings; | |
425 var cssPrefix = settings.cssPrefix; | |
426 var $number = $('<a class="'+cssPrefix+'regionnumber">'+index+'</a>'); | |
427 $regionDiv.append($number); | |
428 return $regionDiv; | |
429 }; | |
430 | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
431 // construct a region from a rectangle |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
432 var addRegionDiv = function (data, rect, attributes, number) { // ### |
1095 | 433 var settings = data.settings; |
434 var cssPrefix = settings.cssPrefix; | |
435 var $regionDiv = newRegionDiv(data); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
436 addRegionAttributes(data, $regionDiv, attributes); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
437 if (settings.showRegionNumbers && number) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
438 addRegionNumber(data, $regionDiv, number); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
439 } |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
440 $regionDiv.data('rect', rect); |
1095 | 441 // handle click events on div |
442 $regionDiv.on('click.dlRegion', function(evt) { | |
443 $(data).trigger('regionClick', [$regionDiv]); | |
444 }); | |
445 return $regionDiv; | |
446 }; | |
447 | |
851 | 448 // create regions from URL parameters |
449 var createRegionsFromURL = function (data) { | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
450 var cssPrefix = data.settings.cssPrefix; |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
451 var attr = {'class' : cssPrefix+"regionURL"}; |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
452 var userRegions = unpackRegions(data); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
453 $.each(userRegions, function(index, rect) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
454 addRegionDiv(data, rect, attr, index+1); |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
455 }); |
792 | 456 }; |
457 | |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
458 // create regions from HTML |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
459 var createRegionsFromHTML = function (data) { |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
460 // regions are defined in "area" tags |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
461 var $content = data.$elem.find(data.settings.areaSelector); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
462 var cssPrefix = data.settings.cssPrefix; |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
463 console.debug("createRegionsFromHTML. elems found: ", $content.length); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
464 $content.each(function(index, area) { |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
465 var $area = $(area); |
852 | 466 // the "coords" attribute contains the region coords (0..1) |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
467 var coords = $area.attr('coords'); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
468 var title = $area.attr('title'); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
469 // create the rectangle |
1095 | 470 var rect = parseCoords(data, coords); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
471 if (rect == null) { |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
472 return console.error('bad coords in HTML:', title, coords); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
473 } |
1095 | 474 // copy attributes |
873 | 475 var attributes = {}; |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
476 for (var n in data.settings.regionAttributes) { |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
477 attributes[n] = $area.attr(n); |
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
478 } |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
479 var $regionDiv = addRegionDiv(data, rect, attributes); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
480 // mark div as regionHTML |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
481 $regionDiv.addClass(cssPrefix+'regionHTML'); |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
482 var $contents = $area.contents().clone(); |
1095 | 483 if (attributes.href != null) { // TODO: href set in region??? |
1025 | 484 // wrap contents in a-tag |
485 var $ca = $('<a href="'+attributes.href+'"/>'); | |
486 $ca.append($contents); | |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
487 // alt attribute is also content (BTW: area-tag has no content()) |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
488 $ca.append($area.attr('alt')); |
1025 | 489 $regionDiv.append($ca); |
490 } else { | |
491 $regionDiv.append($contents); | |
492 // alt attribute is also content (BTW: area-tag has no content()) | |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
493 $regionDiv.append($area.attr('alt')); |
1025 | 494 } |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
495 }); |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
496 }; |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
497 |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
498 // select region divs (HTML or URL) |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
499 var getRegions = function (data, selector) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
500 var cssPrefix = data.settings.cssPrefix; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
501 var $regions = data.$elem.find('div.'+cssPrefix+selector); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
502 return $regions; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
503 }; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
504 |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
505 // list of HTML regions matching text in its title attribute |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
506 var matchRegionText = function (data, text) { |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
507 var $regions = getRegions(data, 'regionsHTML'); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
508 var re = new RegExp(text); |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
509 return $.grep($regions, function($item, index) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
510 return re.match($item.data('text')); |
1094
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
511 }); |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
512 }; |
8d6bc18f7145
some polishing and refactoring, preparation for region text search
hertzhaft
parents:
1093
diff
changeset
|
513 |
1095 | 514 // html for later insertion |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
515 var regionInfoHTML = function (data, $regions) { |
1095 | 516 var cssPrefix = data.settings.cssPrefix; |
517 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'html"/>'); | |
518 $infoDiv.append($('<div/>').text('<map class="'+cssPrefix+'keep '+cssPrefix+'regioncontent">')); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
519 $regions.each(function(index, region) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
520 var rect = $(region).data('rect'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
521 var coords = packCoords(rect, ','); |
1095 | 522 $infoDiv.append($('<div/>').text('<area coords="' + coords + '"/>')); |
523 }); | |
524 $infoDiv.append($('<div/>').text('</map>')); | |
525 return $infoDiv; | |
526 }; | |
527 | |
528 // SVG-style | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
529 var regionInfoSVG = function (data, $regions) { |
1095 | 530 var cssPrefix = data.settings.cssPrefix; |
531 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'svgattr"/>'); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
532 $regions.each(function(index, region) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
533 var rect = $(region).data('rect'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
534 var coords = packCoords(rect, ','); |
1095 | 535 $infoDiv.append($('<div/>').text('"' + coords + '"')); |
536 }); | |
537 return $infoDiv; | |
538 }; | |
539 | |
540 // CSV-style | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
541 var regionInfoCSV = function (data, $regions) { |
1095 | 542 var cssPrefix = data.settings.cssPrefix; |
543 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'csv"/>'); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
544 $regions.each(function(index, region) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
545 var rect = $(region).data('rect'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
546 var coords = packCoords(rect, ','); |
1095 | 547 $infoDiv.append($('<div/>').text(index+1 + ": " + coords)); |
548 }); | |
549 return $infoDiv; | |
550 }; | |
551 | |
552 // digilib-style (h,w@x,y) | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
553 var regionInfoDigilib = function (data, $regions) { |
1095 | 554 var cssPrefix = data.settings.cssPrefix; |
555 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'digilib"/>'); | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
556 $regions.each(function(index, region) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
557 var rect = $(region).data('rect'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
558 var coords = packCoords(rect, ','); |
1095 | 559 $infoDiv.append($('<div/>').text(coords)); |
560 }); | |
561 return $infoDiv; | |
562 }; | |
563 | |
813 | 564 // show a region on top of the scaler image |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
565 var renderRegion = function (data, $regionDiv, anim) { |
813 | 566 if (!data.imgTrafo) return; |
950
164d69e2c481
much nicer implementation of preview for scrolling and zooming.
robcast
parents:
947
diff
changeset
|
567 var zoomArea = data.zoomArea; |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
568 var rect = $regionDiv.data('rect').copy(); |
813 | 569 var show = data.settings.isRegionVisible; |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
570 if (show && zoomArea.overlapsRect(rect) && !rect.containsRect(zoomArea)) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
571 rect.clipTo(zoomArea); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
572 var screenRect = data.imgTrafo.transform(rect); |
1067 | 573 // console.debug("renderRegion: pos=",geom.position(screenRect)); |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
574 if (anim) { |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
575 $regionDiv.fadeIn(); |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
576 } else{ |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
577 $regionDiv.show(); |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
578 } |
1024 | 579 // adjustDiv sets wrong coords when called BEFORE show() |
851 | 580 screenRect.adjustDiv($regionDiv); |
813 | 581 } else { |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
582 if (anim) { |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
583 $regionDiv.fadeOut(); |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
584 } else{ |
824 | 585 $regionDiv.hide(); |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
586 } |
813 | 587 } |
588 }; | |
589 | |
590 // show regions | |
850
47a6b93bde43
always show html-defined regions. wrong pos still not fixed
hertzhaft
parents:
848
diff
changeset
|
591 var renderRegions = function (data, anim) { |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
592 var render = function(index, region) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
593 renderRegion(data, $(region), anim); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
594 }; |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
595 var $regions = getRegions(data, 'region') |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
596 $regions.each(render); |
813 | 597 }; |
598 | |
1091 | 599 // read region data from URL parameters |
813 | 600 var unpackRegions = function (data) { |
601 var rg = data.settings.rg; | |
1095 | 602 if (rg == null) return []; |
603 var coords = rg.split(","); | |
604 var regions = $map(coords, function(coord, index) { | |
605 var pos = coord.split("/", 4); | |
813 | 606 var rect = geom.rectangle(pos[0], pos[1], pos[2], pos[3]); |
1095 | 607 return rect; |
608 }); | |
609 return regions; | |
792 | 610 }; |
611 | |
1091 | 612 // pack user regions array into a URL parameter string |
813 | 613 var packRegions = function (data) { |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
614 var $regions = getRegions(data, 'regionsURL'); |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
615 if ($regions.length == 0) { |
815 | 616 data.settings.rg = null; |
617 return; | |
618 } | |
1096
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
619 var coords = $.map($regions, function($region, index) { |
3c75dda660bf
more refactoring: use jquery selections instead of arrays
hertzhaft
parents:
1095
diff
changeset
|
620 packCoords($region, '/'); |
1095 | 621 }); |
622 var rg = coords.join(','); | |
813 | 623 data.settings.rg = rg; |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
624 console.debug('pack regions:', rg); |
792 | 625 }; |
626 | |
1095 | 627 // zoom to the region coordinates |
628 var zoomToRegion = function (data, region) { | |
629 digilib.actions.zoomArea(data, region); | |
630 }; | |
631 | |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
632 // reload display after a region has been added or removed |
813 | 633 var redisplay = function (data) { |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
634 if (data.settings.processUserRegions) { |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
635 packRegions(data); |
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
636 } |
813 | 637 fn.redisplay(data); |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
638 }; |
813 | 639 |
1091 | 640 // event handler, gets called when a newRegion event is triggered |
1095 | 641 var handleNewRegion = function (evt, $regionDiv) { |
1091 | 642 var data = this; |
643 var settings = data.settings; | |
1095 | 644 console.debug("regions: handleNewRegion", $regionDiv); |
1091 | 645 if (typeof settings.onNewRegion === 'function') { |
646 // execute callback | |
1095 | 647 return settings.onNewRegion(data, $regionDiv); |
1091 | 648 } |
649 if (typeof settings.onNewRegion === 'string') { | |
650 // execute action | |
1095 | 651 return actions[settings.onNewRegion](data, $regionDiv); |
1091 | 652 } |
653 }; | |
654 | |
655 // event handler, gets called when a regionClick event is triggered | |
1095 | 656 var handleRegionClick = function (evt, $regionDiv) { |
1091 | 657 var data = this; |
658 var settings = data.settings; | |
1095 | 659 console.debug("regions: handleRegionClick", $regionDiv); |
660 if ($regionDiv.data('href')) { | |
1091 | 661 // follow the href attribute of the region area |
1095 | 662 window.location = $regionDiv.data('href'); //TODO: how about target? |
1091 | 663 } |
664 if (typeof settings.onClickRegion === 'function') { | |
665 // execute callback | |
1095 | 666 return settings.onClickRegion(data, $regionDiv); |
1091 | 667 } |
668 if (typeof settings.onClickRegion === 'string') { | |
669 // execute action | |
1095 | 670 return actions[settings.onClickRegion](data, $regionDiv); |
1091 | 671 } |
672 }; | |
673 | |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
674 // event handler, reads region parameter and creates region divs |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
675 var handleSetup = function (evt) { |
941 | 676 var data = this; |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
677 var settings = data.settings; |
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
678 console.debug("regions: handleSetup", settings.rg); |
1048 | 679 // regions with content are given in HTML divs |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
680 if (settings.processHtmlRegions) { |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
681 createRegionsFromHTML(data); |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
682 } |
1048 | 683 // regions are defined in the URL |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
684 if (settings.processUserRegions) { |
851 | 685 createRegionsFromURL(data); |
818
eff74cfaaf97
read regions from HTML (not working yet), show info
hertzhaft
parents:
815
diff
changeset
|
686 } |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
687 }; |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
688 |
851 | 689 // event handler, sets buttons and shows regions when scaler img is reloaded |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
690 var handleUpdate = function (evt) { |
941 | 691 var data = this; |
850
47a6b93bde43
always show html-defined regions. wrong pos still not fixed
hertzhaft
parents:
848
diff
changeset
|
692 console.debug("regions: handleUpdate"); |
848 | 693 var settings = data.settings; |
694 fn.highlightButtons(data, 'regions' , settings.isRegionVisible); | |
850
47a6b93bde43
always show html-defined regions. wrong pos still not fixed
hertzhaft
parents:
848
diff
changeset
|
695 renderRegions(data); |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
696 }; |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
697 |
1048 | 698 // additional buttons |
699 var installButtons = function (data) { | |
700 var settings = data.settings; | |
701 var mode = settings.interactionMode; | |
702 var buttonSettings = settings.buttonSettings[mode]; | |
703 // configure buttons through digilib "regionSet" option | |
704 var buttonSet = settings.regionSet || regionSet; | |
705 // set regionSet to [] or '' for no buttons (when showing regions only) | |
706 if (buttonSet.length && buttonSet.length > 0) { | |
707 buttonSettings.regionSet = buttonSet; | |
708 buttonSettings.buttonSets.push('regionSet'); | |
709 } | |
710 }; | |
711 | |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
712 // plugin installation called by digilib on plugin object. |
813 | 713 var install = function(plugin) { |
714 digilib = plugin; | |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
715 console.debug('installing regions plugin. digilib:', digilib); |
1048 | 716 // import digilib functions |
717 $.extend(fn, digilib.fn); | |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
718 // import geometry classes |
813 | 719 geom = fn.geometry; |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
720 // add defaults, actions, buttons |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
721 $.extend(digilib.defaults, defaults); |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
722 $.extend(digilib.actions, actions); |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
723 $.extend(digilib.buttons, buttons); |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
724 }; |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
725 |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
726 // plugin initialization |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
727 var init = function (data) { |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
728 console.debug('initialising regions plugin. data:', data); |
835 | 729 var $elem = data.$elem; |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
730 var settings = data.settings; |
996 | 731 var cssPrefix = data.settings.cssPrefix; |
1093
75a54db031dd
move found region into view, keep zoom factor if possible
hertzhaft
parents:
1092
diff
changeset
|
732 FULL_AREA = geom.rectangle(0, 0, 1, 1); |
1048 | 733 // install event handlers |
848 | 734 var $data = $(data); |
920 | 735 $data.on('setup', handleSetup); |
736 $data.on('update', handleUpdate); | |
1091 | 737 $data.on('newRegion', handleNewRegion); |
738 $data.on('regionClick', handleRegionClick); | |
1095 | 739 // default: autoZoom to region, when clicked - DEPRECATED |
740 if (settings.autoZoomOnClick && settings.onClickRegion == null) { | |
741 settings.onClickRegion = zoomToRegion; | |
742 } | |
743 // install region buttons if user defined regions are allowed | |
1027
ff19b9e936d3
allow predefined and user regions at the same time.
robcast
parents:
1025
diff
changeset
|
744 if (settings.processUserRegions) { |
1091 | 745 // add "rg" to digilibParamNames |
1088
16215fc22fbf
better separation of HTML and user defined regions
hertzhaft
parents:
1067
diff
changeset
|
746 // settings.digilibParamNames.push('rg'); |
1091 | 747 // TODO: this leads double params, because |
748 // settings.additionalParamNames is created earlier than this plugin's init() action | |
1048 | 749 if (digilib.plugins.buttons != null) { |
750 installButtons(data); | |
823 | 751 } |
813 | 752 } |
792 | 753 }; |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
754 |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
755 // plugin object with name and install/init methods |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
756 // shared objects filled by digilib on registration |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
757 var pluginProperties = { |
1048 | 758 name : 'regions', |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
759 install : install, |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
760 init : init, |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
761 buttons : {}, |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
762 actions : {}, |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
763 fn : {}, |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
764 plugins : {} |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
765 }; |
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
766 |
792 | 767 if ($.fn.digilib == null) { |
808
ae8e98c479d5
stub for new plugins; overlay div for regions plugin
hertzhaft
parents:
799
diff
changeset
|
768 $.error("jquery.digilib.regions must be loaded after jquery.digilib!"); |
792 | 769 } else { |
799
12f790cb30de
started to adapt regions plugin to new plugin mechanism
hertzhaft
parents:
792
diff
changeset
|
770 $.fn.digilib('plugin', pluginProperties); |
792 | 771 } |
772 })(jQuery); |