Context Navigation

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

Last change on this file since 15542 was 8961, checked in by grum, 13 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.

Download in other formats: