source: extensions/GrumPluginClasses/js/ui.inputDotArea.js @ 10818

Last change on this file since 10818 was 8961, checked in by grum, 14 years ago

release 3.4.0
fix bug:1984, bug:2109
js file are minified, remove packed files

  • Property svn:executable set to *
File size: 15.0 KB
Line 
1/**
2 * -----------------------------------------------------------------------------
3 * file: ui.inputDotArea.js
4 * file version: 1.0.0
5 * date: 2010-11-04
6 *
7 * A jQuery plugin provided by the piwigo's plugin "GrumPluginClasses"
8 *
9 * -----------------------------------------------------------------------------
10 * Author     : Grum
11 *   email    : grum@piwigo.com
12 *   website  : http://photos.grum.fr
13 *   PWG user : http://forum.phpwebgallery.net/profile.php?id=3706
14 *
15 *   << May the Little SpaceFrog be with you ! >>
16 * -----------------------------------------------------------------------------
17 *
18 *
19 *
20 *
21 * :: HISTORY ::
22 *
23 * | release | date       |
24 * | 1.0.0   | 2010/11/04 | first release
25 * |         |            |
26 * |         |            |
27 * |         |            |
28 * |         |            |
29 * |         |            |
30 * |         |            |
31 *
32 */
33
34
35
36(
37  function($)
38  {
39    /*
40     * plugin 'public' functions
41     */
42    var publicMethods =
43    {
44      init : function (opt)
45        {
46          return this.each(function()
47            {
48              // default values for the plugin
49              var $this=$(this),
50                  data = $this.data('options'),
51                  objects = $this.data('objects'),
52                  properties = $this.data('properties'),
53                  options =
54                    {
55                      range:
56                        {
57                          x:[0,100],
58                          y:[0,100]
59                        },
60                      width:0,
61                      height:0,
62                      disabled:false,
63                      change:null
64                    };
65
66              // if options given, merge it
67              // if(opt) $.extend(options, opt); ==> options are set by setters
68
69              $this.data('options', options);
70
71
72              if(!properties)
73              {
74                $this.data('properties',
75                  {
76                    initialized:false,
77                    values:
78                      {
79                        x:50,
80                        y:50
81                      },
82                    isValid:true,
83                    mouseIsDown:false
84                  }
85                );
86                properties=$this.data('properties');
87              }
88
89              if(!objects)
90              {
91                objects =
92                  {
93                    container:$('<div/>',
94                        {
95                          'class':'ui-inputDotArea',
96                          css:{
97                            width:'100%',
98                            height:'100%'
99                          }
100                        }
101                    )
102                    .bind('mousedown.inputDotArea',
103                        function (event)
104                        {
105                          privateMethods.mouseDown($this, event);
106                        }
107                      )
108                     .bind('mouseup.inputDotArea',
109                       function (event)
110                       {
111                         privateMethods.mouseUp($this, event);
112                       }
113                     )
114                     .bind('mousemove.inputDotArea',
115                        function (event)
116                        {
117                          privateMethods.mouseMove($this, event);
118                        }
119                      ),
120                    dot:$('<div/>',
121                      {
122                        'class':'ui-inputDotArea-dot'
123                      }
124                    )
125
126                  };
127
128                $this
129                  .html('')
130                  .append(objects.container.append(objects.dot));
131
132                $this.data('objects', objects);
133              }
134
135              privateMethods.setOptions($this, opt);
136            }
137          );
138        }, // init
139      destroy : function ()
140        {
141          return this.each(
142            function()
143            {
144              // default values for the plugin
145              var $this=$(this),
146                  objects = $this.data('objects');
147              objects.dot.remove();
148              objects.container.unbind().remove();
149              $this
150                .unbind('.inputDotArea')
151                .css(
152                  {
153                    width:'',
154                    height:''
155                  }
156                );
157            }
158          );
159        }, // destroy
160
161      options: function (value)
162        {
163          return(
164            this.each(
165              function()
166              {
167                privateMethods.setOptions($(this), value);
168              }
169            )
170          );
171        }, // options
172
173      disabled: function (value)
174        {
175          if(value!=null)
176          {
177            return(
178              this.each(
179                function()
180                {
181                  privateMethods.setDisabled($(this), value);
182                }
183              )
184            );
185          }
186          else
187          {
188            var options = this.data('options');
189
190            if(options)
191            {
192              return(options.disabled);
193            }
194            else
195            {
196              return('');
197            }
198          }
199        }, // disabled
200
201      width: function (value)
202        {
203          if(value!=null)
204          {
205            return(
206              this.each(
207                function()
208                {
209                  privateMethods.setWidth($(this), value, true);
210                }
211              )
212            );
213          }
214          else
215          {
216            var options=this.data('options');
217            return(options.width);
218          }
219        }, // width
220
221      height: function (value)
222        {
223          if(value!=null)
224          {
225            return(
226              this.each(
227                function()
228                {
229                  privateMethods.setHeight($(this), value, true);
230                }
231              )
232            );
233          }
234          else
235          {
236            var options=this.data('options');
237            return(options.height);
238          }
239        }, // height
240
241      range: function (value)
242        {
243          if(value!=null)
244          {
245            return(
246              this.each(
247                function()
248                {
249                  privateMethods.setRange($(this), value, true);
250                }
251              )
252            );
253          }
254          else
255          {
256            var options=this.data('options');
257            return(options.range);
258          }
259        }, // value
260
261      values: function (value)
262        {
263          if(value!=null)
264          {
265            // set selected value
266            return(
267              this.each(
268                function()
269                {
270                  privateMethods.setValues($(this), value, true);
271                }
272              )
273            );
274          }
275          else
276          {
277            // return the selected tags
278            var properties=this.data('properties');
279            return(properties.values);
280          }
281        }, // value
282
283      isValid: function (value)
284        {
285          if(value!=null)
286          {
287            // set selected value
288            return(
289              this.each(
290                function()
291                {
292                  privateMethods.setIsValid($(this), value);
293                }
294              )
295            );
296          }
297          else
298          {
299            // return the selected tags
300            var properties=this.data('properties');
301            return(properties.isValid);
302          }
303        }, // isValid
304
305      change: function (value)
306        {
307          if(value!=null && $.isFunction(value))
308          {
309            // set selected value
310            return(
311              this.each(
312                function()
313                {
314                  privateMethods.setEventChange($(this), value);
315                }
316              )
317            );
318          }
319          else
320          {
321            // return the selected value
322            var options=this.data('options');
323
324            if(options)
325            {
326              return(options.change);
327            }
328            else
329            {
330              return(null);
331            }
332          }
333        } // change
334
335    }; // methods
336
337
338    /*
339     * plugin 'private' methods
340     */
341    var privateMethods =
342    {
343      setOptions : function (object, value)
344        {
345          var properties=object.data('properties'),
346              options=object.data('options');
347
348          if(!$.isPlainObject(value)) return(false);
349
350          properties.initialized=false;
351
352          privateMethods.setWidth(object, (value.width!=null)?value.width:options.width);
353          privateMethods.setHeight(object, (value.height!=null)?value.height:options.height);
354          privateMethods.setRange(object, (value.range!=null)?value.range:options.range);
355          privateMethods.setValues(object, (value.values!=null)?value.values:properties.values, true);
356
357          privateMethods.setEventChange(object, (value.change!=null)?value.change:options.change);
358
359          properties.initialized=true;
360        },
361
362      setIsValid : function (object, value)
363        {
364          var objects=object.data('objects'),
365              properties=object.data('properties');
366/*
367          if(properties.isValid!=value && properties.initialized)
368          {
369            properties.isValid=value;
370            if(properties.isValid)
371            {
372              objects.container.removeClass('ui-error');
373              objects.input.removeClass('ui-error');
374            }
375            else
376            {
377              objects.container.addClass('ui-error');
378              objects.input.addClass('ui-error');
379            }
380          }
381*/
382          return(properties.isValid);
383        },
384
385
386      setWidth : function (object, value)
387        {
388          var options=object.data('options'),
389              objects=object.data('objects'),
390              properties=object.data('properties');
391
392          if((!properties.initialized || options.width!=value) && value>0)
393          {
394            options.width=value;
395            objects.container.css('width', options.width+'px');
396          }
397          return(options.width);
398        },
399
400      setHeight : function (object, value)
401        {
402          var options=object.data('options'),
403              objects=object.data('objects'),
404              properties=object.data('properties');
405
406          if((!properties.initialized || options.height!=value) && value>0)
407          {
408            options.height=value;
409            objects.container.css('height', options.height+'px');
410          }
411          return(options.height);
412        },
413
414      setDisabled : function (object, value)
415        {
416          var options=object.data('options'),
417              objects=object.data('objects'),
418              properties=object.data('properties');
419
420          if((!properties.initialized || options.disabled!=value) && (value==true || value==false))
421          {
422            options.disabled=value;
423            objects.input.attr('disabled', options.disabled);
424          }
425          return(options.disabled);
426        },
427
428
429      setRange : function (object, value)
430        {
431          var options=object.data('options'),
432              properties=object.data('properties'),
433              objects=object.data('objects');
434
435          if(value.x==false || ($.isArray(value.x) && value.x[0]<=value.x[1]))
436          {
437            options.range.x=value.x;
438          }
439
440          if(value.y==false || ($.isArray(value.y) && value.y[0]<=value.y[1]))
441          {
442            options.range.y=value.y;
443          }
444
445          return(options.range);
446        }, //setValue
447
448
449      setValues : function (object, value, apply)
450        {
451          var options=object.data('options'),
452              properties=object.data('properties'),
453              objects=object.data('objects'),
454              tmp={x:'', y:''};
455
456          if(!(
457               (value.x==null || (value.x!=null && options.range.x[0]<=value.x && value.x<=options.range.x[1])) &&
458               (value.y==null || (value.y!=null && options.range.y[0]<=value.y && value.y<=options.range.y[1])) &&
459               !(value.x==null && value.y==null)
460              )
461            )
462          {
463            return(false);
464          }
465
466          if(value.x!=null) properties.values.x=value.x;
467          if(value.y!=null) properties.values.y=value.y;
468
469          if(apply)
470          {
471            if(options.range.x==false)
472            {
473              tmp.x=options.width/2;
474            }
475            else
476            {
477              tmp.x=properties.values.x*options.width/(options.range.x[1]-options.range.x[0])+options.range.x[0];
478            }
479            tmp.x-=6;
480
481            if(options.range.y==false)
482            {
483              tmp.y=options.height/2;
484            }
485            else
486            {
487              tmp.y=properties.values.y*options.height/(options.range.y[1]-options.range.y[0])+options.range.y[0];
488            }
489            tmp.y-=6;
490
491            objects.dot.css(
492              {
493                top:tmp.y+'px',
494                left:tmp.x+'px'
495              }
496            );
497          }
498
499          if(options.change) object.trigger('inputDotAreaChange', properties.values);
500
501          return(true);
502        }, //setValue
503
504      setEventChange : function (object, value)
505        {
506          var options=object.data('options');
507
508          options.change=value;
509          object.unbind('inputDotAreaChange');
510          if(value) object.bind('inputDotAreaChange', options.change);
511          return(options.change);
512        },
513
514      mouseDown : function (object, event)
515        {
516          var properties=object.data('properties');
517
518          properties.mouseIsDown=true;
519          privateMethods.mouseMove(object, event);
520        },
521
522      mouseUp : function (object, event)
523        {
524          var properties=object.data('properties');
525
526          properties.mouseIsDown=false;
527        },
528
529      mouseMove : function (object, event)
530        {
531          var properties=object.data('properties'),
532              objects=object.data('objects'),
533              options=object.data('options'),
534              values={};
535
536          if(properties.mouseIsDown)
537          {
538            event.layerX=event.pageX-objects.container.offset().left;
539            event.layerY=event.pageY-objects.container.offset().top;
540
541            if(options.range.x!=false)
542            {
543              values.x=options.range.x[0]+event.layerX*(options.range.x[1]-options.range.x[0])/options.width;
544            }
545            if(options.range.y!=false)
546            {
547              values.y=options.range.y[0]+event.layerY*(options.range.y[1]-options.range.y[0])/options.height;
548            }
549
550            privateMethods.setValues(object, values, true);
551          }
552        }
553
554
555    };
556
557
558    $.fn.inputDotArea = function(method)
559    {
560      if(publicMethods[method])
561      {
562        return publicMethods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
563      }
564      else if(typeof method === 'object' || ! method)
565      {
566        return publicMethods.init.apply(this, arguments);
567      }
568      else
569      {
570        $.error( 'Method ' +  method + ' does not exist on jQuery.inputDotArea' );
571      }
572    } // $.fn.inputDotArea
573
574  }
575)(jQuery);
576
577
Note: See TracBrowser for help on using the repository browser.