1/*!
2 * WHMCS Dynamic Dropdown Library
3 *
4 * Based upon Selectize.js
5 *
6 * @copyright Copyright (c) WHMCS Limited 2005-2016
7 * @license http://www.whmcs.com/license/ WHMCS Eula
8 */
9
10jQuery(document).ready(
11 function()
12 {
13 var multiSelectize = jQuery('.selectize-multi-select'),
14 standardSelectize = jQuery('.selectize-select'),
15 promoSelectize = jQuery('.selectize-promo'),
16 tags = jQuery('.selectize-tags'),
17 newTicketCC = jQuery('.selectize-newTicketCc,.selectize-ticketCc'),
18 currentValue = '';
19
20 jQuery(multiSelectize).selectize(
21 {
22 plugins: ['remove_button'],
23 valueField: jQuery(multiSelectize).attr('data-value-field'),
24 labelField: 'name',
25 searchField: 'name',
26 allowEmptyOption: true,
27 create: false,
28 maxItems: null,
29 render: {
30 item: function(item, escape) {
31 return '<div><span class="name">' + escape(item.name) + '</span></div>';
32 },
33 option: function(item, escape) {
34 return '<div><span class="name">' + escape(item.name) + '</span></div>';
35 }
36 },
37 onItemRemove: function(value) {
38 if (jQuery(this)[0].$input[0].id == 'multi-view' && value != 'any' && value != 'flagged') {
39 jQuery(this)[0].removeItem('any', true);
40 }
41 }
42 }
43 );
44
45 jQuery(standardSelectize).selectize(
46 {
47 valueField: jQuery(standardSelectize).attr('data-value-field'),
48 labelField: 'name',
49 searchField: 'name',
50 allowEmptyOption: jQuery(standardSelectize).attr('data-allow-empty-option'),
51 create: false,
52 maxItems: 1,
53 render: {
54 item: function(item, escape) {
55 var colour = '';
56 if (typeof item.colour !== 'undefined' && item.colour !== '#FFF') {
57 colour = ' style="background-color: ' + escape(item.colour) + ';"';
58 }
59 return '<div' + colour + '><span class="name">' + escape(item.name) + '</span></div>';
60 },
61 option: function(item, escape) {
62 var colour = '';
63 if (typeof item.colour !== 'undefined' && item.colour !== '#FFF') {
64 colour = ' style="background-color: ' + escape(item.colour) + ';"';
65 }
66 return '<div' + colour + '><span class="name">' + escape(item.name) + '</span></div>';
67 }
68 },
69 onFocus: function() {
70 currentValue = this.getValue();
71 this.clear();
72 },
73 onBlur: function()
74 {
75 if (this.getValue() == '') {
76 this.setValue(currentValue);
77 }
78 if (
79 jQuery(standardSelectize).hasClass('selectize-auto-submit')
80 && currentValue !== this.getValue()
81 ) {
82 this.setValue(this.getValue());
83 jQuery(standardSelectize).parent('form').submit();
84 }
85 }
86 }
87 );
88
89 jQuery(promoSelectize).selectize(
90 {
91 valueField: jQuery(promoSelectize).attr('data-value-field'),
92 labelField: 'name',
93 searchField: 'name',
94 allowEmptyOption: jQuery(promoSelectize).attr('data-allow-empty-option'),
95 create: false,
96 maxItems: 1,
97 render: {
98 item: function(item, escape) {
99 var colour = '';
100 var promo = item.name.split(' - ');
101 if (typeof item.colour !== 'undefined' && item.colour !== '#FFF' && item.colour !== '') {
102 colour = ' style="background-color: ' + escape(item.colour) + ';"';
103 }
104 if (typeof otherPromos !== 'undefined'
105 && item.optgroup === otherPromos
106 && currentValue !== ''
107 ) {
108 jQuery('#nonApplicablePromoWarning').show();
109 } else {
110 jQuery('#nonApplicablePromoWarning').hide();
111 }
112 if (promo[1]) {
113 return '<div' + colour + '>'
114 + '<strong>' + escape(promo[0]) + '</strong>'
115 + '<small style="overflow: hidden"> - ' + escape(promo[1]) + '</small>'
116 + '</div>';
117 } else {
118 return '<div' + colour + '>'
119 + escape(promo[0])
120 + '</div>';
121 }
122 },
123 option: function(item, escape) {
124 var colour = '';
125 var promo = item.name.split(' - ');
126 if (typeof item.colour !== 'undefined' && item.colour !== '#FFF' && item.colour !== '') {
127 colour = ' style="background-color: ' + escape(item.colour) + ';"';
128 }
129 if (promo[1]) {
130 return '<div' + colour + '>'
131 + '<strong>' + escape(promo[0]) + '</strong><br />'
132 + escape(promo[1])
133 + '</div>';
134 } else {
135 return '<div' + colour + '>'
136 + escape(promo[0])
137 + '</div>';
138 }
139 }
140 },
141 onFocus: function() {
142 this.$control.parent('div').css('overflow', 'visible');
143 currentValue = this.getValue();
144 this.clear();
145 },
146 onBlur: function()
147 {
148 this.$control.parent('div').css('overflow', 'hidden');
149 if (this.getValue() === '') {
150 this.setValue(currentValue);
151 updatesummary();
152 }
153 if (
154 jQuery(promoSelectize).hasClass('selectize-auto-submit')
155 && currentValue !== this.getValue()
156 ) {
157 this.setValue(this.getValue());
158 jQuery(promoSelectize).parent('form').submit();
159 }
160 }
161 }
162 );
163
164 jQuery(tags).selectize(
165 {
166 plugins: ['remove_button'],
167 valueField: 'text',
168 searchField: ['text'],
169 delimiter: ',',
170 persist: false,
171 create: function(input) {
172 return {
173 value: input,
174 text: input
175 }
176 },
177 render: {
178 item: function(item, escape) {
179 return '<div><span class="item">' + escape(item.text) + '</span></div>';
180 },
181 option: function(item, escape) {
182 return '<div><span class="item">' + escape(item.text) + '</span></div>';
183 }
184 },
185 load: function(query, callback) {
186 if (!query.length) return callback();
187 jQuery.ajax({
188 url: window.location.href,
189 type: 'POST',
190 dataType: 'json',
191 data: {
192 action: 'gettags',
193 q: query,
194 token: csrfToken
195 },
196 error: function() {
197 callback();
198 },
199 success: function(res) {
200 callback(res);
201 }
202 });
203 },
204 onItemAdd: function (value)
205 {
206 jQuery.ajax({
207 url: window.location.href,
208 type: 'POST',
209 data: {
210 action: 'addTag',
211 newTag: value,
212 token: csrfToken
213 }
214 }).success(function() {
215 jQuery.growl.notice({ title: "", message: "Saved successfully!" });
216 });
217 },
218 onItemRemove: function(value)
219 {
220 jQuery.ajax({
221 url: window.location.href,
222 type: 'POST',
223 data: {
224 action: 'removeTag',
225 removeTag: value,
226 token: csrfToken
227 }
228 }).success(function() {
229 jQuery.growl.notice({ title: "", message: "Saved successfully!" });
230 });
231 }
232 }
233 );
234
235 jQuery(newTicketCC).selectize(
236 {
237 plugins: ['remove_button'],
238 valueField: 'text',
239 searchField: ['text'],
240 delimiter: ',',
241 persist: true,
242 create: function(input) {
243 input = input.toLowerCase();
244 return {
245 value: input,
246 text: input,
247 name: input,
248 iconclass: ''
249 }
250 },
251 render: {
252 item: function(item, escape) {
253 var name = '';
254 if (typeof item.iconclass !== 'undefined' && item.iconclass.length > 0) {
255 name = '<span style="padding-right: 8px"><i class="' + escape(item.iconclass) + '"></i></span>'
256 + escape(item.name);
257 } else {
258 name = escape(item.name);
259 }
260 return '<div class="selectize">'
261 + '<span class="name">' + name + '</span>'
262 + '</div>';
263 },
264 option: function(item, escape) {
265 var name = '';
266 if (typeof item.iconclass !== 'undefined' && item.iconclass.length > 0) {
267 name = '<span style="padding-right: 8px"><i class="' + escape(item.iconclass) + '"></i></span>'
268 + escape(item.name);
269 } else {
270 name = escape(item.name);
271 }
272 return '<div class="selectize">'
273 + '<span class="name">' + name + '</span>'
274 + '<span class="email">' + escape(item.text) + '</span>'
275 + '</div>';
276 }
277 }
278 }
279 );
280 }
281);
282