Mercurial > hg > digilib-old

comparison client/digitallibrary/jquery/jquery.digilib.regions.js @ 808:ae8e98c479d5 jquery

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
stub for new plugins; overlay div for regions plugin
author hertzhaft
date Sun, 20 Feb 2011 13:24:49 +0100
parents 12f790cb30de
children 1a7b14deae3a
comparison
equal deleted inserted replaced
807:1b1728926534 808:ae8e98c479d5
51 // array of defined regions 51 // array of defined regions
52 'regions' : [] 52 'regions' : []
53 }; 53 };
54 54
55 var actions = { 55 var actions = {
56
56 // define a region interactively with two clicked points 57 // define a region interactively with two clicked points
57 "setRegion" : function(data) { 58 "setRegion" : function(data) {
58 var $elem = data.$elem; 59 var $elem = data.$elem;
60 var $body = $('body');
61 var bodyRect = geom.rectangle($body);
59 var $scaler = data.$scaler; 62 var $scaler = data.$scaler;
60 var picRect = geom.rectangle($scaler); 63 var scalerRect = geom.rectangle($scaler);
61 var pt1, pt2; 64 var pt1, pt2;
62 // TODO: temporary rectangle only, pass values to "addRegion" factory 65 // overlay prevents other elements from reacting to mouse events
63 var $tempDiv = $('<div class="region" style="display:none"/>'); 66 var $overlay = $('<div class="digilib-overlay"/>');
64 $elem.append($tempDiv); 67 $body.append($overlay);
65 68 bodyRect.adjustDiv($overlay);
69 // the region to be defined
70 var $regionDiv = $('<div class="region" style="display:none"/>');
71 $elem.append($regionDiv);
72
73 // mousedown handler: start sizing
66 var regionStart = function (evt) { 74 var regionStart = function (evt) {
67 pt1 = geom.position(evt); 75 pt1 = geom.position(evt);
68 // setup and show zoom div 76 // setup and show zoom div
69 pt1.adjustDiv($tempDiv); 77 pt1.adjustDiv($regionDiv);
70 $tempDiv.width(0).height(0); 78 $regionDiv.width(0).height(0);
71 $tempDiv.show(); 79 $regionDiv.show();
72 // register events 80 // register mouse events
73 $elem.bind("mousemove.dlRegion", regionMove); 81 $overlay.bind("mousemove.dlRegion", regionMove);
74 $elem.bind("mouseup.dlRegion", regionEnd); 82 $overlay.bind("mouseup.dlRegion", regionEnd);
75 return false; 83 return false;
76 }; 84 };
77 85
78 // mouse move handler 86 // mousemove handler: size region
79 var regionMove = function (evt) { 87 var regionMove = function (evt) {
80 pt2 = geom.position(evt); 88 pt2 = geom.position(evt);
81 var rect = geom.rectangle(pt1, pt2); 89 var rect = geom.rectangle(pt1, pt2);
82 rect.clipTo(picRect); 90 rect.clipTo(scalerRect);
83 // update zoom div 91 // update region
84 rect.adjustDiv($tempDiv); 92 rect.adjustDiv($regionDiv);
85 return false; 93 return false;
86 }; 94 };
87 95
88 // mouseup handler: end moving 96 // mouseup handler: end sizing
89 var regionEnd = function (evt) { 97 var regionEnd = function (evt) {
90 pt2 = geom.position(evt); 98 pt2 = geom.position(evt);
91 // assume a click and continue if the area is too small 99 // assume a click and continue if the area is too small
92 var clickRect = geom.rectangle(pt1, pt2); 100 var clickRect = geom.rectangle(pt1, pt2);
93 if (clickRect.getArea() <= 5) return false; 101 if (clickRect.getArea() <= 5) return false;
94 // unregister events 102 // unregister mouse events and get rid of overlay
95 $elem.unbind("mousemove.dlRegion", regionMove); 103 $overlay.unbind("mousemove.dlRegion", regionMove);
96 $elem.unbind("mouseup.dlRegion", regionEnd); 104 $overlay.unbind("mouseup.dlRegion", regionEnd);
97 // clip and transform 105 $overlay.remove();
98 clickRect.clipTo(picRect); 106 // clip region
99 clickRect.adjustDiv($tempDiv); 107 clickRect.clipTo(scalerRect);
100 $tempDiv.remove(); 108 clickRect.adjustDiv($regionDiv);
101 data.settings.regions.push(clickRect); 109 data.settings.regions.push(clickRect); // TODO: trafo, params
102 // fn.redisplay(data); 110 // fn.redisplay(data);
103 return false; 111 return false;
104 }; 112 };
105 113
106 // clear old handler (also ZoomDrag)
107 $scaler.unbind('.dlRegion');
108 $elem.unbind('.dlRegion');
109 // bind start zoom handler 114 // bind start zoom handler
110 $scaler.one('mousedown.dlRegion', regionStart); 115 $overlay.one('mousedown.dlRegion', regionStart);
111 }, 116 },
112 117
113 // remove the last added region 118 // remove the last added region
114 "removeRegion" : function (data) { 119 "removeRegion" : function (data) {
115 var $regionDiv = data.settings.regions.pop(); 120 var $regionDiv = data.settings.regions.pop();
216 // } 221 // }
217 }; 222 };
218 223
219 // plugin installation called by digilib on plugin object. 224 // plugin installation called by digilib on plugin object.
220 var install = function(digilib) { 225 var install = function(digilib) {
226 console.debug('installing regions plugin. digilib:', digilib);
221 // import geometry classes 227 // import geometry classes
222 geom = digilib.fn.geometry; 228 geom = digilib.fn.geometry;
223 FULL_AREA = geom.rectangle(0,0,1,1); 229 FULL_AREA = geom.rectangle(0,0,1,1);
224 // add defaults 230 // add defaults, actions, buttons
225 $.extend(digilib.defaults, defaults); 231 $.extend(digilib.defaults, defaults);
226 // add actions
227 $.extend(digilib.actions, actions); 232 $.extend(digilib.actions, actions);
228 // add buttons
229 $.extend(digilib.buttons, buttons); 233 $.extend(digilib.buttons, buttons);
230 }; 234 };
231 235
232 // plugin initialization 236 // plugin initialization
233 var init = function (data) { 237 var init = function (data) {
246 $data.bind('update', handleUpdate); 250 $data.bind('update', handleUpdate);
247 $data.bind('redisplay', handleRedisplay); 251 $data.bind('redisplay', handleRedisplay);
248 $data.bind('dragZoom', handleDragZoom); 252 $data.bind('dragZoom', handleDragZoom);
249 }; 253 };
250 254
251 // plugin object with name and init 255 // plugin object with name and install/init methods
252 // shared objects filled by digilib on registration 256 // shared objects filled by digilib on registration
253 var pluginProperties = { 257 var pluginProperties = {
254 name : 'region', 258 name : 'region',
255 install : install, 259 install : install,
256 init : init, 260 init : init,
259 fn : {}, 263 fn : {},
260 plugins : {} 264 plugins : {}
261 }; 265 };
262 266
263 if ($.fn.digilib == null) { 267 if ($.fn.digilib == null) {
264 $.error("jquery.digilib.birdview must be loaded after jquery.digilib!"); 268 $.error("jquery.digilib.regions must be loaded after jquery.digilib!");
265 } else { 269 } else {
266 $.fn.digilib('plugin', pluginProperties); 270 $.fn.digilib('plugin', pluginProperties);
267 } 271 }
268 })(jQuery); 272 })(jQuery);