Context Navigation

source: extensions/GrumPluginClasses/js/ui.inputConsole.js @ 15542

Last change on this file since 15542 was 12215, checked in by grum, 13 years ago
fix bugs bug:2160 - CategorySelector : extended description are not managed +add some functions to GPCCore
Property svn:executable set to ``*
File size: 23.5 KB

Line
1	/**
2	* -----------------------------------------------------------------------------
3	* file: ui.inputConsole.js
4	* file version: 1.0.1
5	* date: 2010-11-05
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/10/10 \| 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	disabled:false,
56	prompt:'>',
57	historySize:8,
58	historyHeight:60,
59	change:null,
60	submit:null,
61	submited:null,
62	focusChanged:null
63	};
64
65	// if options given, merge it
66	// if(opt) $.extend(options, opt); ==> options are set by setters
67
68	$this.data('options', options);
69
70
71	if(!properties)
72	{
73	$this.data('properties',
74	{
75	initialized:false,
76	value:'',
77	isValid:true,
78	mouseIsOver:false,
79	historyIsVisible:false,
80	inputMargins:0,
81	focus:false
82	}
83	);
84	properties=$this.data('properties');
85	}
86
87	if(!objects)
88	{
89	objects =
90	{
91	container:$('<div/>',
92	{
93	'class':'ui-inputConsole',
94	css:{
95	width:'100%'
96	}
97	}
98	).bind('click.inputConsole',
99	function ()
100	{
101	objects.input.focus();
102	}
103	)
104	.bind('mouseenter',
105	function ()
106	{
107	properties.mouseIsOver=true;
108	}
109	)
110	.bind('mouseleave',
111	function ()
112	{
113	properties.mouseIsOver=false;
114	}
115	),
116	inputContainer:$('<div/>',
117	{
118	'class':'ui-inputConsole-input'
119	}
120	),
121	input:$('<input>',
122	{
123	type:"text",
124	value:''
125	}
126	).bind('focusout.inputConsole',
127	function ()
128	{
129	privateMethods.lostFocus($this);
130	}
131	)
132	.bind('focus.inputConsole',
133	function ()
134	{
135	privateMethods.getFocus($this);
136	}
137	)
138	.bind('keyup.inputConsole',
139	function (event)
140	{
141	privateMethods.keyUp($this, event);
142	}
143	),
144	prompt:$('<div/>',
145	{
146	html:options.prompt,
147	'class':'ui-inputConsole-prompt'
148	}
149	),
150	historyContainer:$('<div/>',
151	{
152	'class':'ui-inputConsole-history',
153	css:{
154	display:'none'
155	}
156	}
157	),
158	historyBackground:$('<div/>',
159	{
160	'class':'ui-inputConsole-historyBg'
161	}
162	),
163	historyListContainer:$('<div/>',
164	{
165	'class':'ui-inputConsole-historyListContainer'
166	}
167	),
168	historyList:$('<ul/>')
169
170	};
171
172	$this
173	.html('')
174	.append(
175	objects.container
176	.append(
177	objects.historyContainer
178	.append(objects.historyBackground)
179	.append(objects.historyListContainer.append(objects.historyList))
180	)
181	.append(
182	objects.inputContainer.append(objects.prompt).append(objects.input)
183	)
184	).bind('resize.inputConsole',
185	function ()
186	{
187	privateMethods.setObjectsWidth($this);
188	}
189	);
190
191	properties.inputMargins=objects.input.outerWidth(true)-objects.input.width();
192
193	$this.data('objects', objects);
194	}
195
196	privateMethods.setOptions($this, opt);
197	}
198	);
199	}, // init
200	destroy : function ()
201	{
202	return this.each(
203	function()
204	{
205	// default values for the plugin
206	var $this=$(this),
207	objects = $this.data('objects');
208	objects.input.unbind().remove();
209	objects.container.unbind().remove();
210	$this
211	.unbind('.inputConsole')
212	.css(
213	{
214	width:'',
215	height:''
216	}
217	);
218	}
219	);
220	}, // destroy
221
222	options: function (value)
223	{
224	return this.each(function()
225	{
226	privateMethods.setOptions($(this), value);
227	}
228	);
229	}, // options
230
231	disabled: function (value)
232	{
233	if(value!=null)
234	{
235	return this.each(function()
236	{
237	privateMethods.setDisabled($(this), value);
238	}
239	);
240	}
241	else
242	{
243	var options = this.data('options');
244
245	if(options)
246	{
247	return(options.disabled);
248	}
249	else
250	{
251	return('');
252	}
253	}
254	}, // disabled
255
256
257	prompt: function (value)
258	{
259	if(value!=null)
260	{
261	return this.each(function()
262	{
263	privateMethods.setPrompt($(this), value);
264	}
265	);
266	}
267	else
268	{
269	var options = this.data('options');
270
271	if(options)
272	{
273	return(options.prompt);
274	}
275	else
276	{
277	return('');
278	}
279	}
280	}, // prompt
281
282	historySize: function (value)
283	{
284	if(value!=null)
285	{
286	return this.each(function()
287	{
288	privateMethods.setHistorySize($(this), value);
289	}
290	);
291	}
292	else
293	{
294	var options = this.data('options');
295
296	if(options)
297	{
298	return(options.historySize);
299	}
300	else
301	{
302	return('');
303	}
304	}
305	}, // historySize
306
307	historyHeight: function (value)
308	{
309	if(value!=null)
310	{
311	return this.each(function()
312	{
313	privateMethods.setHistoryHeight($(this), value);
314	}
315	);
316	}
317	else
318	{
319	var options = this.data('options');
320
321	if(options)
322	{
323	return(options.historyHeight);
324	}
325	else
326	{
327	return('');
328	}
329	}
330	}, // historyHeight
331
332	value: function (value)
333	{
334	if(value!=null)
335	{
336	// set selected value
337	return this.each(function()
338	{
339	privateMethods.setValue($(this), value, true);
340	}
341	);
342	}
343	else
344	{
345	// return the selected tags
346	var properties=this.data('properties');
347	return(properties.value);
348	}
349	}, // value
350
351	history: function (value, param)
352	{
353	var objects=this.data('objects');
354
355	if(value!=null)
356	{
357	// set selected value
358	return this.each(function()
359	{
360	switch(value)
361	{
362	case 'clear':
363	objects.historyList.html('');
364	break;
365	case 'addResult':
366	privateMethods.updateHistoryResult($(this), param);
367	break;
368	}
369	}
370	);
371	}
372	else
373	{
374	// return the selected tags
375	var returned=[];
376	objects.historyList.children().each(
377	function (index, item)
378	{
379	returned.push($(item).text());
380	}
381	);
382	return(returned);
383	}
384	}, // value
385
386	isValid: function (value)
387	{
388	if(value!=null)
389	{
390	// set selected value
391	return this.each(function()
392	{
393	privateMethods.setIsValid($(this), value);
394	}
395	);
396	}
397	else
398	{
399	// return the selected tags
400	var properties=this.data('properties');
401	return(properties.isValid);
402	}
403	}, // isValid
404
405	focus: function (value)
406	{
407	if(value!=null)
408	{
409	// set selected value
410	return this.each(function()
411	{
412	privateMethods.setFocus($(this), value);
413	}
414	);
415	}
416	else
417	{
418	// return the selected tags
419	var properties=this.data('properties');
420	return(properties.focus);
421	}
422	}, // isValid
423
424	change: function (value)
425	{
426	if(value!=null && $.isFunction(value))
427	{
428	// set selected value
429	return this.each(function()
430	{
431	privateMethods.setEventChange($(this), value);
432	}
433	);
434	}
435	else
436	{
437	// return the selected value
438	var options=this.data('options');
439
440	if(options)
441	{
442	return(options.change);
443	}
444	else
445	{
446	return(null);
447	}
448	}
449	}, // change
450
451
452	submit: function (value)
453	{
454	if(value!=null && $.isFunction(value))
455	{
456	// set selected value
457	return this.each(function()
458	{
459	privateMethods.setEventSubmit($(this), value);
460	}
461	);
462	}
463	else
464	{
465	// return the selected value
466	var options=this.data('options');
467
468	if(options)
469	{
470	return(options.submit);
471	}
472	else
473	{
474	return(null);
475	}
476	}
477	}, // submit
478
479	submited: function (value)
480	{
481	if(value!=null && $.isFunction(value))
482	{
483	// set selected value
484	return this.each(function()
485	{
486	privateMethods.setEventSubmited($(this), value);
487	}
488	);
489	}
490	else
491	{
492	// return the selected value
493	var options=this.data('options');
494
495	if(options)
496	{
497	return(options.submited);
498	}
499	else
500	{
501	return(null);
502	}
503	}
504	}, // submited
505
506	focusChanged: function (value)
507	{
508	if(value!=null && $.isFunction(value))
509	{
510	// set selected value
511	return this.each(function()
512	{
513	privateMethods.setEventFocusChanged($(this), value);
514	}
515	);
516	}
517	else
518	{
519	// return the selected value
520	var options=this.data('options');
521
522	if(options)
523	{
524	return(options.focusChanged);
525	}
526	else
527	{
528	return(null);
529	}
530	}
531	}, // focusChanged
532
533
534
535	}; // methods
536
537
538	/*
539	* plugin 'private' methods
540	*/
541	var privateMethods =
542	{
543	setOptions : function (object, value)
544	{
545	var properties=object.data('properties'),
546	options=object.data('options');
547
548	if(!$.isPlainObject(value)) return(false);
549
550	properties.initialized=false;
551
552	privateMethods.setHistoryHeight(object, (value.historyHeight!=null)?value.historyHeight:options.historyHeight);
553	privateMethods.setHistorySize(object, (value.historySize!=null)?value.historySize:options.historySize);
554	privateMethods.setPrompt(object, (value.prompt!=null)?value.prompt:options.prompt);
555	privateMethods.setValue(object, (value.value!=null)?value.value:options.value, true);
556	privateMethods.setDisabled(object, (value.disabled!=null)?value.disabled:options.disabled);
557
558	privateMethods.setEventChange(object, (value.change!=null)?value.change:options.change);
559	privateMethods.setEventSubmit(object, (value.submit!=null)?value.submit:options.submit);
560	privateMethods.setEventSubmited(object, (value.submited!=null)?value.submited:options.submited);
561	privateMethods.setEventFocusChanged(object, (value.focusChanged!=null)?value.focusChanged:options.focusChanged);
562
563	properties.initialized=true;
564	},
565
566	setPrompt: function (object, value)
567	{
568	var objects=object.data('objects'),
569	options=object.data('options'),
570	properties=object.data('properties');
571
572	if(!properties.initialized \|\| options.prompt!=value)
573	{
574	options.prompt=value;
575	objects.prompt.html(options.prompt);
576	privateMethods.setObjectsWidth(object);
577	}
578	return(options.prompt);
579	},
580
581	setHistorySize: function (object, value)
582	{
583	var options=object.data('options'),
584	properties=object.data('properties');
585
586	if(!properties.initialized \|\| options.historySize!=value)
587	{
588	options.historySize=value;
589	privateMethods.updateHistory(object, null);
590	}
591	return(options.historySize);
592	},
593
594	setHistoryHeight: function (object, value)
595	{
596	var objects=object.data('objects'),
597	options=object.data('options'),
598	properties=object.data('properties');
599
600	if(!properties.initialized \|\| options.historyHeight!=value)
601	{
602	options.historyHeight=value;
603	objects.historyContainer.css(
604	{
605	height:options.historyHeight+'px',
606	'margin-top':(-options.historyHeight)+'px'
607	}
608	);
609	}
610	return(options.historyHeight);
611	},
612
613	setIsValid : function (object, value)
614	{
615	var objects=object.data('objects'),
616	properties=object.data('properties');
617
618	if(properties.isValid!=value)
619	{
620	properties.isValid=value;
621	if(properties.isValid)
622	{
623	objects.container.removeClass('ui-error');
624	objects.input.removeClass('ui-error');
625	}
626	else
627	{
628	objects.container.addClass('ui-error');
629	objects.input.addClass('ui-error');
630	}
631	}
632	return(properties.isValid);
633	},
634
635	setDisabled : function (object, value)
636	{
637	var options=object.data('options'),
638	properties=object.data('properties');
639
640	if((!properties.initialized \|\| options.disabled!=value) && (value==true \|\| value==false))
641	{
642	options.disabled=value;
643
644	}
645	return(options.disabled);
646	},
647
648	setValue : function (object, value, apply)
649	{
650	var options=object.data('options'),
651	properties=object.data('properties'),
652	objects=object.data('objects');
653
654	properties.value=value;
655
656	if(apply) objects.input.val(properties.value);
657
658	if(options.change) object.trigger('inputConsoleChange', properties.value);
659
660	return(true);
661	}, //setValue
662
663
664	setFocus : function (object, value)
665	{
666	var objects=object.data('objects'),
667	options=object.data('options'),
668	properties=object.data('properties');
669
670	if(value===true\|\|value===false)
671	{
672	if(value)
673	{
674	objects.input.focus();
675	}
676	else
677	{
678	objects.input.blur();
679	}
680
681	properties.focus=value;
682	if(options.focusChanged) object.trigger('inputConsoleFocusChanged', properties.focus);
683	}
684
685	return(properties.focus);
686	},
687
688	getFocus : function (object)
689	{
690	var objects=object.data('objects'),
691	options=object.data('options'),
692	properties=object.data('properties');
693
694	properties.focus=true;
695	objects.historyContainer.css('display', 'block');
696	privateMethods.setObjectsWidth(object);
697	if(options.focusChanged) object.trigger('inputConsoleFocusChanged', properties.focus);
698	},
699
700	lostFocus : function (object)
701	{
702	var objects=object.data('objects'),
703	options=object.data('options'),
704	properties=object.data('properties');
705
706	properties.focus=false;
707	objects.historyContainer.css('display', 'none');
708	if(options.focusChanged) object.trigger('inputConsoleFocusChanged', properties.focus);
709	},
710
711	setEventChange : function (object, value)
712	{
713	var options=object.data('options');
714
715	options.change=value;
716	object.unbind('inputConsoleChange');
717	if(value) object.bind('inputConsoleChange', options.change);
718	return(options.change);
719	},
720
721	setEventSubmit : function (object, value)
722	{
723	var options=object.data('options');
724
725	options.submit=value;
726	object.unbind('inputConsoleSubmit');
727	if(value) object.bind('inputConsoleSubmit', options.submit);
728	return(options.submit);
729	},
730
731	setEventSubmited : function (object, value)
732	{
733	var options=object.data('options');
734
735	options.submited=value;
736	object.unbind('inputConsoleSubmited');
737	if(value) object.bind('inputConsoleSubmited', options.submited);
738	return(options.submited);
739	},
740
741	setEventFocusChanged : function (object, value)
742	{
743	var options=object.data('options');
744
745	options.focusChanged=value;
746	object.unbind('inputConsoleFocusChanged');
747	if(value) object.bind('inputConsoleFocusChanged', options.focusChanged);
748	return(options.focusChanged);
749	},
750
751	keyUp : function (object, event)
752	{
753	var properties=object.data('properties'),
754	options=object.data('options'),
755	objects=object.data('objects');
756
757	if(event.keyCode==13 && // DOM_VK_ENTER
758	properties.isValid)
759	{
760	if(options.submit) object.trigger('inputConsoleSubmit', properties.value);
761	privateMethods.updateHistory(object, properties.value);
762	if(options.submited) object.trigger('inputConsoleSubmited', properties.value);
763	privateMethods.setValue(object, '', true);
764	}
765	else
766	{
767	privateMethods.setValue(object, objects.input.val(), false);
768	}
769	},
770
771	updateHistory : function (object, item)
772	{
773	var options=object.data('options'),
774	objects=object.data('objects');
775
776	if(item!='' && item!=null)
777	objects.historyList.append(
778	$('<li/>', { html: '<span class="ui-inputConsole-historyCmd">'+item+'</span>' } )
779	.bind('click', object,
780	function (event)
781	{
782	privateMethods.setValue(event.data, $(this).children('.ui-inputConsole-historyCmd').html(), true);
783	}
784	)
785	);
786
787	while(objects.historyList.children().length>options.historySize)
788	{
789	objects.historyList.children(':first').remove();
790	}
791	objects.historyContainer.scrollTop(objects.historyList.height());
792	},
793
794	updateHistoryResult : function (object, item)
795	{
796	var options=object.data('options'),
797	objects=object.data('objects');
798
799	if(item!='' && item!=null)
800	{
801	objects.historyList.children(':last').html(
802	objects.historyList.children(':last').html() + "<span class='ui-inputConsole-historyResult'>"+item+"</span>"
803	);
804	}
805
806	objects.historyListContainer.scrollTop(objects.historyList.height());
807	},
808
809	setObjectsWidth : function (object)
810	{
811	var objects=object.data('objects')
812	properties=object.data('properties');
813
814	if(objects.inputContainer.width()>0)
815	{
816	objects.input.css('width',
817	(objects.inputContainer.innerWidth()-objects.prompt.outerWidth(true)-properties.inputMargins)+'px'
818	);
819	objects.historyContainer.css(
820	{
821	width:objects.inputContainer.innerWidth()+'px',
822	'margin-left':((objects.historyContainer.width()-objects.historyContainer.outerWidth())/2)+'px'
823	}
824	);
825	}
826	}
827
828	};
829
830
831	$.fn.inputConsole = function(method)
832	{
833	if(publicMethods[method])
834	{
835	return publicMethods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
836	}
837	else if(typeof method === 'object' \|\| ! method)
838	{
839	return publicMethods.init.apply(this, arguments);
840	}
841	else
842	{
843	$.error( 'Method ' + method + ' does not exist on jQuery.inputConsole' );
844	}
845	} // $.fn.inputConsole
846
847	}
848	)(jQuery);

Note: See TracBrowser for help on using the repository browser.

Download in other formats: