source: extensions/GrumPluginClasses/js/ui.inputText.js @ 24278

Last change on this file since 24278 was 17735, checked in by grum, 12 years ago

version 3.5.4 - fix minor bug & add new functions to framework

  • Property svn:executable set to *
File size: 29.2 KB
Line 
1/**
2 * -----------------------------------------------------------------------------
3 * file: ui.inputText.js
4 * file version: 1.1.3
5 * date: 2012-09-03
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 *
14 *   << May the Little SpaceFrog be with you ! >>
15 * -----------------------------------------------------------------------------
16 *
17 *
18 *
19 *
20 * :: HISTORY ::
21 *
22 * | release | date       |
23 * | 1.0.0   | 2010/11/04 | * first release
24 * |         |            |
25 * | 1.1.0   | 2011/01/09 | * if div content is not empty and text value not
26 * |         |            |   defined, use of div content to define text value
27 * |         |            |
28 * |         |            | * add multilanguage managment
29 * |         |            |
30 * | 1.1.1   | 2011/01/31 | * add function ':clear' for 'languagesValues' method
31 * |         |            |
32 * | 1.1.2   | 2012/06/18 | * improve memory managment
33 * |         |            |
34 * |         |            | * fix bug on regExp option
35 * |         |            |
36 * | 1.1.3   | 2012/09/03 | * fix bug on initial value settings & check value validity
37 * |         |            |
38 * |         |            |
39 * |         |            |
40 * |         |            |
41 *
42 */
43
44
45
46(
47  function($)
48  {
49    /*
50     * plugin 'public' functions
51     */
52    var publicMethods =
53    {
54      init : function (opt)
55        {
56          return this.each(function()
57            {
58              // default values for the plugin
59              var $this=$(this),
60                  data = $this.data('options'),
61                  objects = $this.data('objects'),
62                  properties = $this.data('properties'),
63                  options =
64                    {
65                      languages:[],
66                      currentLanguage:'',
67                      languagesValues:{},
68                      languageSelector:'',
69                      multilines:false,
70                      disabled:false,
71                      textAlign:'left',
72                      displayChar:0,
73                      maxChar:0,
74                      numRows:1,
75                      regExp:'',
76                      value:'',
77                      change:null
78                    };
79
80              // if options given, merge it
81              // if(opt) $.extend(options, opt); ==> options are set by setters
82              if(options.value=='' && $.trim($this.html())!='') options.value=$.trim($this.html());
83
84              $this.data('options', options);
85
86              if(!properties)
87              {
88                $this.data('properties',
89                  {
90                    initialized:false,
91                    re:/.*/,
92                    value:'',
93                    isValid:true,
94                    languagesValues:{}
95                  }
96                );
97                properties=$this.data('properties');
98              }
99
100              if(!objects)
101              {
102                objects =
103                  {
104                    container:$('<div/>',
105                        {
106                          'class':'ui-inputText',
107                          css:{
108                            width:'100%'
109                          }
110                        }
111                    ).bind('click.inputText',
112                        function ()
113                        {
114                          objects.input.focus();
115                        }
116                      ),
117                    input:null
118                  };
119
120                $this
121                  .html('')
122                  .append(objects.container);
123
124                $this.data('objects', objects);
125              }
126
127              privateMethods.setOptions($this, opt);
128            }
129          );
130        }, // init
131      destroy : function ()
132        {
133          return this.each(
134            function()
135            {
136              // default values for the plugin
137              var $this=$(this),
138                  objects = $this.data('objects');
139              objects.input.unbind().remove();
140              objects.container.unbind().remove();
141              $this
142                .unbind('.inputText')
143                .removeData()
144                .css(
145                  {
146                    width:'',
147                    height:''
148                  }
149                );
150              delete $this;
151            }
152          );
153        }, // destroy
154
155      options: function (value)
156        {
157          return(
158            this.each(
159              function()
160              {
161                privateMethods.setOptions($(this), value);
162              }
163            )
164          );
165        }, // options
166
167      disabled: function (value)
168        {
169          if(value!=null)
170          {
171            return(
172              this.each(
173                function()
174                {
175                  privateMethods.setDisabled($(this), value);
176                }
177              )
178            );
179          }
180          else
181          {
182            var options = this.data('options');
183
184            if(options)
185            {
186              return(options.disabled);
187            }
188            else
189            {
190              return('');
191            }
192          }
193        }, // disabled
194
195      textAlign: function (value)
196        {
197          if(value!=null)
198          {
199            return(
200              this.each(
201                function()
202                {
203                  privateMethods.setTextAlign($(this), value);
204                }
205              )
206            );
207          }
208          else
209          {
210            var options = this.data('options');
211
212            if(options)
213            {
214              return(options.textAlign);
215            }
216            else
217            {
218              return('');
219            }
220          }
221        }, // textAlign
222
223      displayChar: function (value)
224        {
225          if(value!=null)
226          {
227            return(
228              this.each(
229                function()
230                {
231                  privateMethods.setDisplayChar($(this), value);
232                }
233              )
234            );
235          }
236          else
237          {
238            var options = this.data('options');
239
240            if(options)
241            {
242              return(options.displayChar);
243            }
244            else
245            {
246              return('');
247            }
248          }
249        }, // displayChar
250
251      maxChar: function (value)
252        {
253          if(value!=null)
254          {
255            return(
256              this.each(
257                function()
258                {
259                  privateMethods.setMaxChar($(this), value);
260                }
261              )
262            );
263          }
264          else
265          {
266            var options = this.data('options');
267
268            if(options)
269            {
270              return(options.maxChar);
271            }
272            else
273            {
274              return('');
275            }
276          }
277        }, // maxChar
278
279      numRows: function (value)
280        {
281          if(value!=null)
282          {
283            return(
284              this.each(
285                function()
286                {
287                  privateMethods.setNumRows($(this), value);
288                }
289              )
290            );
291          }
292          else
293          {
294            var options = this.data('options');
295
296            if(options)
297            {
298              return(options.numRows);
299            }
300            else
301            {
302              return('');
303            }
304          }
305        }, // numRows
306
307      regExp: function (value)
308        {
309          if(value!=null)
310          {
311            return(
312              this.each(
313                function()
314                {
315                  privateMethods.setRegExp($(this), value);
316                }
317              )
318            );
319          }
320          else
321          {
322            var options = this.data('options');
323
324            if(options)
325            {
326              return(options.regExp);
327            }
328            else
329            {
330              return('');
331            }
332          }
333        }, // regExp
334
335      multilines: function ()
336        {
337          // return the selected tags
338          var properties=this.data('properties');
339          return(properties.multilines);
340        }, // multilines
341
342      languages: function (value)
343        {
344          if(value!=null)
345          {
346            // set the known languages
347            return(
348              this.each(
349                function()
350                {
351                  privateMethods.setLanguages($(this), value);
352                }
353              )
354            );
355          }
356          else
357          {
358            // return the known languages
359            var options = this.data('options');
360            return(options.languages);
361          }
362        },
363
364      currentLanguage: function (value)
365        {
366          if(value!=null)
367          {
368            // set the current language
369            return(
370              this.each(
371                function()
372                {
373                  privateMethods.setCurrentLanguage($(this), value);
374                }
375              )
376            );
377          }
378          else
379          {
380            // return the current language
381            var options = this.data('options');
382            return(options.currentLanguage);
383          }
384        },
385
386      languageSelector: function (value)
387        {
388          if(value!=null)
389          {
390            // set the language selector id (inputList object)
391            return(
392              this.each(
393                function()
394                {
395                  privateMethods.setLanguageSelector($(this), value);
396                }
397              )
398            );
399          }
400          else
401          {
402            // return the language selector id
403            var options = this.data('options');
404            return(options.languageSelector);
405          }
406        }, //languageSelector
407
408      languagesValues: function (value)
409        {
410          if(value!=null)
411          {
412            // set the languages values
413            return(
414              this.each(
415                function()
416                {
417                  privateMethods.setLanguagesValues($(this), value);
418                }
419              )
420            );
421          }
422          else
423          {
424            // return the languages values
425            var properties=this.data('properties');
426            return(properties.languagesValues);
427          }
428        },
429
430      value: function (value, language)
431        {
432          if(value!=null)
433          {
434            var options=this.data('options');
435
436            // set selected value
437            return(
438              this.each(
439                function()
440                {
441                  if(language!=null)
442                  {
443                    privateMethods.setLanguageValue($(this), language, value, options.currentLanguage==language);
444                  }
445                  else
446                  {
447                    privateMethods.setValue($(this), value, true);
448                  }
449                }
450              )
451            );
452          }
453          else
454          {
455            // return the selected tags
456            var properties=this.data('properties');
457            return(properties.value);
458          }
459        }, // value
460
461      isValid: function (value)
462        {
463          if(value!=null)
464          {
465            // set selected value
466            return(
467              this.each(
468                function()
469                {
470                  privateMethods.setIsValid($(this), value);
471                }
472              )
473            );
474          }
475          else
476          {
477            // return the selected tags
478            var properties=this.data('properties');
479            return(properties.isValid);
480          }
481        }, // isValid
482
483      change: function (value)
484        {
485          if(value!=null && $.isFunction(value))
486          {
487            // set selected value
488            return(
489              this.each(
490                function()
491                {
492                  privateMethods.setEventChange($(this), value);
493                }
494              )
495            );
496          }
497          else
498          {
499            // return the selected value
500            var options=this.data('options');
501
502            if(options)
503            {
504              return(options.change);
505            }
506            else
507            {
508              return(null);
509            }
510          }
511        }, // change
512
513      doTranslation: function ()
514        {
515          // set selected value
516          return(
517            this.each(
518              function()
519              {
520                privateMethods.doTranslation($(this));
521              }
522            )
523          );
524        } // doTranslation
525
526    }; // methods
527
528
529    /*
530     * plugin 'private' methods
531     */
532    var privateMethods =
533    {
534      /**
535       * return true is given value is a valid numeric value, according to the
536       * rules defined by the object
537       * @param Object object
538       * @param value
539       * @return Bool
540       */
541      isValid : function (object, value)
542        {
543          var properties=object.data('properties');
544
545          return(properties.re.test(value));
546        },
547
548      setOptions : function (object, value)
549        {
550          var properties=object.data('properties'),
551              options=object.data('options');
552
553          if(!$.isPlainObject(value)) return(false);
554
555          properties.initialized=false;
556
557          privateMethods.setMultilines(object, (value.multilines!=null)?value.multilines:options.multilines);
558          privateMethods.setDisplayChar(object, (value.displayChar!=null)?value.displayChar:options.displayChar);
559          privateMethods.setMaxChar(object, (value.maxChar!=null)?value.maxChar:options.maxChar);
560          privateMethods.setNumRows(object, (value.numRows!=null)?value.numRows:options.numRows);
561          privateMethods.setRegExp(object, (value.regExp!=null)?value.regExp:options.regExp);
562
563          privateMethods.setLanguages(object, (value.languages!=null)?value.languages:options.languages);
564          privateMethods.setLanguagesValues(object, (value.languagesValues!=null)?value.languagesValues:options.languagesValues);
565          privateMethods.setCurrentLanguage(object, (value.currentLanguage!=null)?value.currentLanguage:options.currentLanguage);
566          privateMethods.setLanguageSelector(object, (value.languageSelector!=null)?value.languageSelector:options.languageSelector);
567
568          if((properties.languagesValues[options.currentLanguage]!=null &&
569              properties.languagesValues[options.currentLanguage]!='' ||
570              properties.languagesValues[options.currentLanguage]==null) &&
571             (value.value!=null && value.value!='' || options.value!='')
572            ) privateMethods.setValue(object, (value.value!=null)?value.value:options.value, true);
573
574          privateMethods.setTextAlign(object, (value.textAlign!=null)?value.textAlign:options.textAlign);
575
576          privateMethods.setDisabled(object, (value.disabled!=null)?value.disabled:options.disabled);
577
578          privateMethods.setEventChange(object, (value.change!=null)?value.change:options.change);
579
580          properties.initialized=true;
581        },
582
583      /**
584       * define the regular expression used to check validity of a numeric value
585       * @param Object object
586       */
587      setRegExp : function (object, value)
588        {
589          var properties=object.data('properties'),
590              flagRE=/^\/(.*)\/(.*)$/,
591              flags=flagRE.exec(value);
592
593          if(flags==null)
594          {
595            flags=['.*', ''];
596          }
597
598          delete properties.re;
599          properties.re = new RegExp(flags[1],flags[2]);
600        },
601
602      setIsValid : function (object, value)
603        {
604          var objects=object.data('objects'),
605              properties=object.data('properties'),
606              check=false;
607
608          if(value=='check')
609          {
610            value=privateMethods.isValid(object, properties.value);
611            check=true;
612          }
613
614          if(properties.isValid!=value && properties.initialized || check)
615          {
616            properties.isValid=value;
617            if(properties.isValid)
618            {
619              objects.container.removeClass('ui-error');
620              objects.input.removeClass('ui-error');
621            }
622            else
623            {
624              objects.container.addClass('ui-error');
625              objects.input.addClass('ui-error');
626            }
627          }
628          return(properties.isValid);
629        },
630
631      setDisplayChar : function (object, value)
632        {
633          var options=object.data('options'),
634              objects=object.data('objects');
635              properties=object.data('properties');
636
637          if((!properties.initialized || options.displayChar!=value) && value>=0)
638          {
639            options.displayChar=value;
640            if(options.displayChar>0)
641            {
642              if(options.multilines)
643              {
644                objects.input.attr('cols', options.displayChar);
645              }
646              else
647              {
648                objects.input.attr('size', options.displayChar);
649              }
650            }
651            else
652            {
653              if(options.multilines)
654              {
655                objects.input.removeAttr('size');
656              }
657              else
658              {
659                objects.input.removeAttr('cols');
660              }
661            }
662          }
663          if(object.width()>0)
664          {
665            objects.input.css(
666              {
667                'width': object.width()+'px',
668                'max-width': object.width()+'px'
669              }
670            );
671          }
672          return(options.displayChar);
673        },
674
675      setMaxChar : function (object, value)
676        {
677          var options=object.data('options'),
678              objects=object.data('objects'),
679              properties=object.data('properties');
680
681          if((!properties.initialized || options.maxChar!=value) && value>=0)
682          {
683            options.maxChar=value;
684            if(!options.multilines)
685            {
686              if(options.maxChar>0)
687              {
688                objects.input.attr('maxlength', options.maxChar);
689              }
690              else
691              {
692                objects.input.removeAttr('maxlength');
693              }
694            }
695          }
696          return(options.maxChar);
697        },
698
699      setNumRows : function (object, value)
700        {
701          var options=object.data('options'),
702              objects=object.data('objects'),
703              properties=object.data('properties');
704
705          if((!properties.initialized || options.numRows!=value) && value>0)
706          {
707            options.numRows=value;
708            if(options.multilines)
709            {
710              objects.input.attr('rows', options.numRows);
711            }
712          }
713          return(options.numRows);
714        },
715
716      setDisabled : function (object, value)
717        {
718          var options=object.data('options'),
719              objects=object.data('objects'),
720              properties=object.data('properties');
721
722          if((!properties.initialized || options.disabled!=value) && (value==true || value==false))
723          {
724            options.disabled=value;
725            objects.input.attr('disabled', options.disabled);
726          }
727          return(options.disabled);
728        },
729
730      setTextAlign : function (object, value)
731        {
732          var options=object.data('options'),
733              objects=object.data('objects'),
734              properties=object.data('properties');
735
736          if((!properties.initialized || options.textAlign!=value) && (value=='left' || value=='right'))
737          {
738            options.textAlign=value;
739            objects.input.css('text-align', options.textAlign);
740          }
741          return(options.textAlign);
742        },
743
744
745      setMultilines : function (object, value)
746        {
747          var options=object.data('options'),
748              objects=object.data('objects'),
749              properties=object.data('properties');
750
751          if((!properties.initialized || options.multilines!=value) && (value==true || value==false))
752          {
753            options.multilines=value;
754
755            if(options.multilines)
756            {
757              objects.input=$('<textarea/>');
758            }
759            else
760            {
761              objects.input=$('<input>',
762                      {
763                        type:"text",
764                        value:''
765                      }
766                    );
767            }
768
769            objects.container.append(
770                objects.input.bind('keyup.inputText',
771                                      function (event)
772                                      {
773                                        return(privateMethods.keyUp(object, event));
774                                      }
775                                    )
776                                  .bind('change.inputText',
777                                      function (event)
778                                      {
779                                        return(privateMethods.change(object, event));
780                                      }
781                                    )
782                                  .bind('keydown.inputText',
783                                      function (event)
784                                      {
785                                        return(privateMethods.keyDown(object, event));
786                                      }
787                                    )
788            );
789
790          }
791          return(options.textAlign);
792        }, //setMultilines
793
794      setLanguages : function (object, value)
795        {
796          var properties=object.data('properties'),
797              options=object.data('options');
798
799          options.languages=value;
800          options.languagesValues={};
801
802          if(options.languages.length>0)
803          {
804            if($.inArray(options.currentLanguage, options.languages)<0 ||
805               options.currentLanguage=='') options.currentLanguage=options.languages[0];
806
807            for(var i=0;i<options.languages.length;i++)
808            {
809              properties.languagesValues[options.languages[i]]='';
810            }
811          }
812          else
813          {
814            options.currentLanguage='';
815          }
816
817          return(options.languages);
818        }, //setLanguages
819
820      setLanguagesValues : function (object, value)
821        {
822          var options=object.data('options'),
823              properties=object.data('properties');
824
825          if(value==':clear')
826          {
827            for(var langValue in properties.languagesValues)
828            {
829              privateMethods.setLanguageValue(object, langValue, '', langValue==options.currentLanguage);
830            }
831          }
832          else if(!$.isEmptyObject(value))
833          {
834            for(var langValue in value)
835            {
836              if(properties.languagesValues[langValue]!=null)
837                  privateMethods.setLanguageValue(object, langValue, value[langValue], langValue==options.currentLanguage);
838            }
839          }
840
841          return(properties.languagesValues);
842        }, //setLanguagesValues
843
844      setLanguageValue : function (object, language, value, updateInput)
845        {
846          var options=object.data('options'),
847              properties=object.data('properties');
848
849          if(properties.languagesValues[language]!=null)
850          {
851            properties.languagesValues[language]=value;
852
853            if(updateInput) privateMethods.setValue(object, properties.languagesValues[options.currentLanguage], true);
854          }
855
856          return(options.languagesValues);
857        }, //setLanguageValue
858
859      setCurrentLanguage : function (object, value)
860        {
861          var options=object.data('options'),
862              properties=object.data('properties');
863
864          if((!properties.initialized || options.currentLanguage!=value) && $.inArray(value, options.languages)>=0)
865          {
866            options.currentLanguage=value;
867
868            privateMethods.setValue(object, properties.languagesValues[options.currentLanguage], true);
869          }
870
871          return(options.currentLanguage);
872        }, //setCurrentLanguage
873
874      setLanguageSelector : function (object, value)
875        {
876          var options=object.data('options'),
877              properties=object.data('properties');
878
879          if((!properties.initialized || options.languageSelector!=value) && value!='' && $('#'+value).length>0)
880          {
881            if(options.languageSelector!='') $('#'+options.languageSelector).unbind('inputListChange');
882            options.languageSelector=value;
883
884            if(options.languageSelector!='')
885              $('#'+options.languageSelector).bind('inputListChange',
886                function (event, lang)
887                {
888                  privateMethods.setCurrentLanguage(object, lang);
889                }
890              );
891          }
892
893          return(options.currentLanguage);
894        }, //setCurrentLanguage
895
896      setValue : function (object, value, apply)
897        {
898          var options=object.data('options'),
899              properties=object.data('properties'),
900              objects=object.data('objects');
901
902          if(properties.initialized && properties.value==value)
903          {
904            return(properties.value);
905          }
906
907          privateMethods.setIsValid(object, privateMethods.isValid(object, value));
908
909          properties.value=value;
910
911          if(apply)
912          {
913            objects.input.val(properties.value);
914          }
915
916          if(options.currentLanguage!='') privateMethods.setLanguageValue(object, options.currentLanguage, value, false);
917
918          if(options.change) object.trigger('inputTextChange', properties.value);
919
920          return(properties.value);
921        }, //setValue
922
923      setEventChange : function (object, value)
924        {
925          var options=object.data('options');
926
927          options.change=value;
928          object.unbind('inputTextChange');
929          if(value) object.bind('inputTextChange', options.change);
930          return(options.change);
931        },
932
933      keyUp : function (object, event)
934        {
935          var objects=object.data('objects');
936
937          if(event.keyCode==9 || //DOM_VK_TAB
938             event.keyCode==12 || //DOM_VK_CLEAR
939             event.keyCode==16 || //DOM_VK_SHIFT
940             event.keyCode==17 || //DOM_VK_CONTROL
941             event.keyCode==18 || //DOM_VK_ALT
942             event.keyCode==33 || //DOM_VK_PAGE_UP
943             event.keyCode==34 || //DOM_VK_PAGE_DOWN
944             event.keyCode==35 || //DOM_VK_END
945             event.keyCode==36 || //DOM_VK_HOME
946             event.keyCode==37 || //DOM_VK_LEFT
947             event.keyCode==38 || //DOM_VK_UP
948             event.keyCode==39 || //DOM_VK_RIGHT
949             event.keyCode==40 || //DOM_VK_DOWN
950             event.keyCode==45 || //DOM_VK_INSERT
951             event.keyCode==93  //DOM_VK_CONTEXT_MENU
952            ) return(false);
953
954          return(privateMethods.setValue(object, objects.input.val(), false));
955        },
956
957      change : function (object, event)
958        {
959          var objects=object.data('objects');
960
961          return(privateMethods.setValue(object, objects.input.val(), false))
962        },
963
964      keyDown : function (object, event)
965        {
966          var objects=object.data('objects'),
967              options=object.data('options');
968
969          if(options.maxChar>0 &&
970             objects.input.val().length>=options.maxChar &&
971             !(event.keyCode==8 || //DOM_VK_BACK_SPACE
972               event.keyCode==9 || //DOM_VK_TAB
973               event.keyCode==12 || //DOM_VK_CLEAR
974               event.keyCode==16 || //DOM_VK_SHIFT
975               event.keyCode==17 || //DOM_VK_CONTROL
976               event.keyCode==18 || //DOM_VK_ALT
977               event.keyCode==33 || //DOM_VK_PAGE_UP
978               event.keyCode==34 || //DOM_VK_PAGE_DOWN
979               event.keyCode==35 || //DOM_VK_END
980               event.keyCode==36 || //DOM_VK_HOME
981               event.keyCode==37 || //DOM_VK_LEFT
982               event.keyCode==38 || //DOM_VK_UP
983               event.keyCode==39 || //DOM_VK_RIGHT
984               event.keyCode==40 || //DOM_VK_DOWN
985               event.keyCode==45 || //DOM_VK_INSERT
986               event.keyCode==46 || //DOM_VK_DELETE
987               event.keyCode==93 || //DOM_VK_CONTEXT_MENU
988               objects.input.get(0).selectionStart!=objects.input.get(0).selectionEnd
989              )
990          ) return(false);
991        },
992
993        /**
994         * do translation through a google translate API call (need the GPC google_translate.js file is loaded)
995         *
996         * @param String input : id of input field ; if empty, translate all localized fields
997         */
998      doTranslation : function(object)
999        {
1000          var objects=object.data('objects'),
1001              properties=object.data('properties'),
1002              options=object.data('options');
1003
1004          if(googleTranslate!=null)
1005          {
1006            googleTranslate(properties.value, '', options.currentLanguage.substr(0,2),
1007              function (result)
1008              {
1009                privateMethods.setValue(object, result, true);
1010              }
1011            );
1012          }
1013        }
1014
1015    };
1016
1017
1018    $.fn.inputText = function(method)
1019    {
1020      if(publicMethods[method])
1021      {
1022        return publicMethods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
1023      }
1024      else if(typeof method === 'object' || ! method)
1025      {
1026        return publicMethods.init.apply(this, arguments);
1027      }
1028      else
1029      {
1030        $.error( 'Method ' +  method + ' does not exist on jQuery.inputText' );
1031      }
1032    } // $.fn.inputText
1033
1034  }
1035)(jQuery);
1036
1037
Note: See TracBrowser for help on using the repository browser.