Context Navigation

source: branches/camp/camp-2_5-E/html/user_data/packages/admin/js/jquery.plugin.js @ 19383

Visit:

Revision 19383, 9.7 KB checked in by miningbrownie, 13 years ago (diff)

Line
1	/**
2	*
3	*/
4	(function($)
5	{
6	jQuery.fn.update = function(o) {
7
8
9	}
10
11	jQuery.fn.multiselect2side = function (o) {
12
13	o = $.extend({
14	selectedPosition: 'right',
15	moveOptions: true,
16	labelTop: 'Top',
17	labelBottom: 'Bottom',
18	labelUp: 'Up',
19	labelDown: 'Down',
20	labelSort: 'Sort',
21	labelsx: 'Available',
22	labeldx: 'Selected',
23	maxSelected: -1
24	}, o);
25
26
27	return this.each(function () {
28	var el = $(this);
29
30	var originalName = $(this).attr("name");
31	if (originalName.indexOf('[') != -1)
32	originalName = originalName.substring(0, originalName.indexOf('['));
33
34	var nameDx = originalName + "ms2side__dx";
35	var nameSx = originalName + "ms2side__sx";
36	var size = $(this).attr("size");
37	// SIZE MIN
38	if (size < 6) {
39	$(this).attr("size", "6");
40	size = 6;
41	}
42
43	// UP AND DOWN
44	var divUpDown =
45	"<div class='ms2side__updown'>" +
46	"<p class='SelSort' title='Sort'>" + o.labelSort + "</p>" +
47	"<p class='MoveTop' title='Move on top selected option'>" + o.labelTop + "</p>" +
48	"<p class='MoveUp' title='Move up selected option'>" + o.labelUp + "</p>" +
49	"<p class='MoveDown' title='Move down selected option'>" + o.labelDown + "</p>" +
50	"<p class='MoveBottom' title='Move on bottom selected option'>" + o.labelBottom + "</p>" +
51	"</div>";
52
53	// CREATE NEW ELEMENT (AND HIDE IT) AFTER THE HIDDED ORGINAL SELECT
54	var htmlToAdd =
55	"<div class='ms2side__div'>" +
56	((o.selectedPosition != 'right' && o.moveOptions) ? divUpDown : "") +
57	"<div class='ms2side__select'>" +
58	(o.labelsx ? ("<div class='ms2side__header'>" + o.labelsx + "</div>") : "") +
59	"<select title='" + o.labelsx + "' name='" + nameSx + "' id='" + nameSx + "' size='" + size + "' multiple='multiple' ></select>" +
60	"</div>" +
61	"<div class='ms2side__options'>" +
62	((o.selectedPosition == 'right')
63	?
64	("<p class='AddOne' title='Add Selected'>&rsaquo;</p>" +
65	"<p class='AddAll' title='Add All'>»</p>" +
66	"<p class='RemoveOne' title='Remove Selected'>&lsaquo;</p>" +
67	"<p class='RemoveAll' title='Remove All'>«</p>")
68	:
69	("<p class='AddOne' title='Add Selected'>&lsaquo;</p>" +
70	"<p class='AddAll' title='Add All'>«</p>" +
71	"<p class='RemoveOne' title='Remove Selected'>&rsaquo;</p>" +
72	"<p class='RemoveAll' title='Remove All'>»</p>")
73	) +
74	"</div>" +
75	"<div class='ms2side__select'>" +
76	(o.labeldx ? ("<div class='ms2side__header'>" + o.labeldx + "</div>") : "") +
77	"<select title='" + o.labeldx + "' name='" + nameDx + "' id='" + nameDx + "' size='" + size + "' multiple='multiple' ></select>" +
78	"</div>" +
79	((o.selectedPosition == 'right' && o.moveOptions) ? divUpDown : "") +
80	"</div>";
81	$(this).after(htmlToAdd).hide();
82
83	// ELEMENTS
84	var allSel = $(this).next().find("select");
85	var leftSel = (o.selectedPosition == 'right') ? allSel.eq(0) : allSel.eq(1);
86	var rightSel = (o.selectedPosition == 'right') ? allSel.eq(1) : allSel.eq(0);
87	// HEIGHT DIV
88	var heightDiv = $(".ms2side__select").eq(0).height();
89
90	// CENTER MOVE OPTIONS AND UPDOWN OPTIONS
91	$(this).next().find('.ms2side__options, .ms2side__updown').each(function(){
92	var top = ((heightDiv/2) - ($(this).height()/2));
93	if (top > 0)
94	$(this).css('padding-top', top + 'px' );
95	})
96
97	// MOVE SELECTED OPTION TO RIGHT, NOT SELECTED TO LEFT
98	$(this).find("option:selected").clone().appendTo(rightSel);
99	$(this).find("option:not(:selected)").clone().appendTo(leftSel);
100
101	// SELECT FIRST LEFT ITEM
102	if (!($.browser.msie && $.browser.version == '6.0'))
103	leftSel.find("option").eq(0).attr("selected", true);
104
105	// ON CHANGE REFRESH ALL BUTTON STATUS
106	allSel.change(function() {
107	var div = $(this).parent().parent();
108	var selectSx = leftSel.children();
109	var selectDx = rightSel.children();
110	var selectedSx = leftSel.find("option:selected");
111	var selectedDx = rightSel.find("option:selected");
112
113	if (selectedSx.size() == 0 \|\|
114	(o.maxSelected >= 0 && (selectedSx.size() + selectDx.size()) > o.maxSelected))
115	div.find(".AddOne").addClass('ms2side__hide');
116	else
117	div.find(".AddOne").removeClass('ms2side__hide');
118
119	// FIRST HIDE ALL
120	div.find(".RemoveOne, .MoveUp, .MoveDown, .MoveTop, .MoveBottom, .SelSort").addClass('ms2side__hide');
121	if (selectDx.size() > 1)
122	div.find(".SelSort").removeClass('ms2side__hide');
123	if (selectedDx.size() > 0) {
124	div.find(".RemoveOne").removeClass('ms2side__hide');
125	// ALL SELECTED - NO MOVE
126	if (selectedDx.size() < selectDx.size()) { // FOR NOW (JOE) && selectedDx.size() == 1
127	if (selectedDx.val() != selectDx.val()) // FIRST OPTION, NO UP AND TOP BUTTON
128	div.find(".MoveUp, .MoveTop").removeClass('ms2side__hide');
129	if (selectedDx.last().val() != selectDx.last().val()) // LAST OPTION, NO DOWN AND BOTTOM BUTTON
130	div.find(".MoveDown, .MoveBottom").removeClass('ms2side__hide');
131	}
132	}
133
134	if (selectSx.size() == 0 \|\|
135	(o.maxSelected >= 0 && selectSx.size() >= o.maxSelected))
136	div.find(".AddAll").addClass('ms2side__hide');
137	else
138	div.find(".AddAll").removeClass('ms2side__hide');
139
140	if (selectDx.size() == 0)
141	div.find(".RemoveAll").addClass('ms2side__hide');
142	else
143	div.find(".RemoveAll").removeClass('ms2side__hide');
144	});
145
146	// DOUBLE CLICK ON LEFT SELECT OPTION
147	leftSel.dblclick(function () {
148	$(this).find("option:selected").each(function(i, selected){
149
150	if (o.maxSelected < 0 \|\| rightSel.children().size() < o.maxSelected) {
151	$(this).remove().appendTo(rightSel);
152	el.find("[value=" + $(selected).val() + "]").attr("selected", true).remove().appendTo(el);
153	}
154	});
155	$(this).trigger('change');
156	});
157
158	// DOUBLE CLICK ON RIGHT SELECT OPTION
159	rightSel.dblclick(function () {
160	$(this).find("option:selected").each(function(i, selected){
161	$(this).remove().appendTo(leftSel);
162	el.find("[value=" + $(selected).val() + "]").attr("selected", false).remove().appendTo(el);
163	});
164	$(this).trigger('change');
165	});
166
167	// CLICK ON OPTION
168	$(this).next().find('.ms2side__options').children().click(function () {
169	if (!$(this).hasClass("ms2side__hide")) {
170	if ($(this).hasClass("AddOne")) {
171	leftSel.find("option:selected").each(function(i, selected){
172	$(this).remove().appendTo(rightSel);
173	el.find("[value=" + $(selected).val() + "]").attr("selected", true).remove().appendTo(el);
174	});
175	}
176	else if ($(this).hasClass("AddAll")) { // ALL SELECTED
177	leftSel.children().appendTo(rightSel);
178	leftSel.children().remove();
179	el.find('option').attr("selected", true);
180	// el.children().attr("selected", true); -- PROBLEM WITH OPTGROUP
181	}
182	else if ($(this).hasClass("RemoveOne")) {
183	rightSel.find("option:selected").each(function(i, selected){
184	$(this).remove().appendTo(leftSel);
185	el.find("[value=" + $(selected).val() + "]").attr("selected", false).remove().appendTo(el);
186	});
187	}
188	else if ($(this).hasClass("RemoveAll")) { // ALL REMOVED
189	rightSel.children().appendTo(leftSel);
190	rightSel.children().remove();
191	el.find('option').attr("selected", false);
192	//el.children().attr("selected", false); -- PROBLEM WITH OPTGROUP
193	}
194	}
195
196	leftSel.trigger('change');
197	});
198
199	// CLICK ON UP - DOWN
200	$(this).next().find('.ms2side__updown').children().click(function () {
201	var selectedDx = rightSel.find("option:selected");
202	var selectDx = rightSel.find("option");
203
204	if (!$(this).hasClass("ms2side__hide")) {
205	if ($(this).hasClass("SelSort")) {
206	// SORT SELECTED ELEMENT
207	selectDx.sort(function(a, b) {
208	var compA = $(a).text().toUpperCase();
209	var compB = $(b).text().toUpperCase();
210	return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
211	})
212	// FIRST REMOVE FROM ORIGINAL SELECT
213	el.find("option:selected").remove();
214	// AFTER ADD ON ORIGINAL AND RIGHT SELECT
215	selectDx.each(function() {
216	rightSel.append($(this).clone().attr("selected", true));
217	el.append($(this).attr("selected", true));
218	});
219	}
220	else if ($(this).hasClass("MoveUp")) {
221	var prev = selectedDx.first().prev();
222	var hPrev = el.find("[value=" + prev.val() + "]");
223
224	selectedDx.each(function() {
225	$(this).insertBefore(prev);
226	el.find("[value=" + $(this).val() + "]").insertBefore(hPrev); // HIDDEN SELECT
227	});
228	}
229	else if ($(this).hasClass("MoveDown")) {
230	var next = selectedDx.last().next();
231	var hNext = el.find("[value=" + next.val() + "]");
232
233	selectedDx.each(function() {
234	$(this).insertAfter(next);
235	el.find("[value=" + $(this).val() + "]").insertAfter(hNext); // HIDDEN SELECT
236	});
237	}
238	else if ($(this).hasClass("MoveTop")) {
239	var first = selectDx.first();
240	var hFirst = el.find("[value=" + first.val() + "]");
241
242	selectedDx.each(function() {
243	$(this).insertBefore(first);
244	el.find("[value=" + $(this).val() + "]").insertBefore(hFirst); // HIDDEN SELECT
245	});
246	}
247	else if ($(this).hasClass("MoveBottom")) {
248	var last = selectDx.last();
249	var hLast = el.find("[value=" + last.val() + "]");
250
251	selectedDx.each(function() {
252	last = $(this).insertAfter(last); // WITH last = SAME POSITION OF SELECTED OPTION AFTER MOVE
253	hLast = el.find("[value=" + $(this).val() + "]").insertAfter(hLast); // HIDDEN SELECT
254	});
255	}
256	}
257
258	leftSel.trigger('change');
259	});
260
261	// HOVER ON OPTION
262	$(this).next().find('.ms2side__options, .ms2side__updown').children().hover(
263	function () {
264	$(this).addClass('ms2side_hover');
265	},
266	function () {
267	$(this).removeClass('ms2side_hover');
268	}
269	);
270
271	// UPDATE BUTTON ON START
272	leftSel.trigger('change');
273	// SHOW WHEN ALL READY
274	$(this).next().show();
275	});
276	};
277	})(jQuery);

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

Download in other formats: