Mercurial > hg > digilib-old
comparison webapp/src/main/webapp/jquery/jquery.digilib.regions.js @ 1060:d9abeaa44c49
better region info
author | hertzhaft |
---|---|
date | Sat, 31 Mar 2012 19:56:53 +0200 |
parents | 4aa90cccb3e4 |
children | a45894a81e40 |
comparison
equal
deleted
inserted
replaced
1059:c7fd2f239953 | 1060:d9abeaa44c49 |
---|---|
71 }; | 71 }; |
72 | 72 |
73 var actions = { | 73 var actions = { |
74 | 74 |
75 // define a region interactively with two clicked points | 75 // define a region interactively with two clicked points |
76 "defineRegion" : function(data) { | 76 defineRegion : function(data) { |
77 if (!data.settings.isRegionVisible) { | 77 if (!data.settings.isRegionVisible) { |
78 alert("Please turn on regions visibility!"); | 78 alert("Please turn on regions visibility!"); |
79 return; | 79 return; |
80 } | 80 } |
81 var cssPrefix = data.settings.cssPrefix; | 81 var cssPrefix = data.settings.cssPrefix; |
138 $overlay.one('mousedown.dlRegion', regionStart); | 138 $overlay.one('mousedown.dlRegion', regionStart); |
139 fn.highlightButtons(data, 'addregion', 1); | 139 fn.highlightButtons(data, 'addregion', 1); |
140 }, | 140 }, |
141 | 141 |
142 // remove the last added region | 142 // remove the last added region |
143 "removeRegion" : function (data) { | 143 removeRegion : function (data) { |
144 if (!data.settings.isRegionVisible) { | 144 if (!data.settings.isRegionVisible) { |
145 alert("Please turn on regions visibility!"); | 145 alert("Please turn on regions visibility!"); |
146 return; | 146 return; |
147 } | 147 } |
148 var region = data.regions.pop(); | 148 var region = data.regions.pop(); |
151 $regionDiv.remove(); | 151 $regionDiv.remove(); |
152 redisplay(data); | 152 redisplay(data); |
153 }, | 153 }, |
154 | 154 |
155 // show/hide regions | 155 // show/hide regions |
156 "toggleRegions" : function (data) { | 156 toggleRegions : function (data) { |
157 var show = !data.settings.isRegionVisible; | 157 var show = !data.settings.isRegionVisible; |
158 data.settings.isRegionVisible = show; | 158 data.settings.isRegionVisible = show; |
159 fn.highlightButtons(data, 'regions', show); | 159 fn.highlightButtons(data, 'regions', show); |
160 renderRegions(data, 1); | 160 renderRegions(data, 1); |
161 }, | 161 }, |
162 | 162 |
163 // show region info in a window | 163 // show region info in a window |
164 "showRegionInfo" : function (data) { | 164 showRegionInfo : function (data) { |
165 var $elem = data.$elem; | 165 var $elem = data.$elem; |
166 var cssPrefix = data.settings.cssPrefix; | 166 var cssPrefix = data.settings.cssPrefix; |
167 var $info = $elem.find('#'+cssPrefix+'regionInfo'); | 167 var infoselector = '#'+cssPrefix+'regionInfo'; |
168 if ($info.length > 0) { | 168 if (fn.find(data, infoselector)) { |
169 fn.withdraw($info); | 169 fn.withdraw($info); |
170 return; | 170 return; |
171 } | 171 } |
172 var html = '\ | 172 var html = '\ |
173 <div id="'+cssPrefix+'regionInfo" class="'+cssPrefix+'keep '+cssPrefix+'regionInfo">\ | 173 <div id="'+cssPrefix+'regionInfo" class="'+cssPrefix+'keep '+cssPrefix+'regionInfo">\ |
174 <div class="'+cssPrefix+'infoheader">\ | 174 <table class="'+cssPrefix+'infoheader">\ |
175 <div class="'+cssPrefix+'infobutton html">HTML</div>\ | 175 <tr>\ |
176 <div class="'+cssPrefix+'infobutton svgattr">SVG</div>\ | 176 <td class="'+cssPrefix+'infobutton html">HTML</td>\ |
177 <div class="'+cssPrefix+'infobutton digilib">Digilib</div>\ | 177 <td class="'+cssPrefix+'infobutton svgattr">SVG</td>\ |
178 <div class="'+cssPrefix+'infobutton x">X</div>\ | 178 <td class="'+cssPrefix+'infobutton csv">CSV</td>\ |
179 </div>\ | 179 <td class="'+cssPrefix+'infobutton digilib">Digilib</td>\ |
180 <td class="'+cssPrefix+'infobutton x">X</td>\ | |
181 </tr>\ | |
182 </table>\ | |
180 </div>'; | 183 </div>'; |
181 $info = $(html); | 184 $info = $(html); |
182 $info.appendTo($elem); | 185 $info.appendTo($elem); |
183 $info.append(regionInfoHTML(data)); | 186 $info.append(regionInfoHTML(data)); |
184 $info.append(regionInfoSVG(data)); | 187 $info.append(regionInfoSVG(data)); |
188 $info.append(regionInfoCSV(data)); | |
185 $info.append(regionInfoDigilib(data)); | 189 $info.append(regionInfoDigilib(data)); |
186 var bind = function(name) { | 190 var bind = function(name) { |
187 $info.find('div.'+name).on('click.regioninfo', function () { | 191 $info.find('.'+name).on('click.regioninfo', function () { |
188 $info.find('div.'+cssPrefix+'info').hide(); | 192 $info.find('div.'+cssPrefix+'info').hide(); |
189 $info.find('div.'+cssPrefix+name).show(); | 193 $info.find('div.'+cssPrefix+name).show(); |
194 fn.centerOnScreen(data, $info); | |
190 }); | 195 }); |
191 }; | 196 }; |
192 bind('html'); | 197 bind('html'); |
193 bind('svgattr'); | 198 bind('svgattr'); |
199 bind('csv'); | |
194 bind('digilib'); | 200 bind('digilib'); |
195 $info.find('.x').on('click.regioninfo', function () { | 201 $info.find('.x').on('click.regioninfo', function () { |
196 fn.withdraw($info); | 202 fn.withdraw($info); |
197 }); | 203 }); |
198 $info.fadeIn(); | 204 $info.fadeIn(); |
205 fn.centerOnScreen(data, $info); | |
199 } | 206 } |
200 }; | 207 }; |
201 | 208 |
202 // store a region div | 209 // store a region div |
203 var storeRegion = function (data, $regionDiv) { | 210 var storeRegion = function (data, $regionDiv) { |
239 $infoDiv.append($('<div/>').text('"' + area + '"')); | 246 $infoDiv.append($('<div/>').text('"' + area + '"')); |
240 }); | 247 }); |
241 return $infoDiv; | 248 return $infoDiv; |
242 }; | 249 }; |
243 | 250 |
251 // SVG-style | |
252 var regionInfoCSV = function (data) { | |
253 var cssPrefix = data.settings.cssPrefix; | |
254 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'csv"/>'); | |
255 $.each(data.regions, function(index, r) { | |
256 var area = [ | |
257 fn.cropFloatStr(r.x), | |
258 fn.cropFloatStr(r.y), | |
259 fn.cropFloatStr(r.width), | |
260 fn.cropFloatStr(r.height)].join(','); | |
261 $infoDiv.append($('<div/>').text(index+1 + ": " + area)); | |
262 }); | |
263 return $infoDiv; | |
264 }; | |
244 // digilib-style | 265 // digilib-style |
245 var regionInfoDigilib = function (data) { | 266 var regionInfoDigilib = function (data) { |
246 var cssPrefix = data.settings.cssPrefix; | 267 var cssPrefix = data.settings.cssPrefix; |
247 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'digilib"/>'); | 268 var $infoDiv = $('<div class="'+cssPrefix+'info '+cssPrefix+'digilib"/>'); |
248 $.each(data.regions, function(index, r) { | 269 $.each(data.regions, function(index, r) { |