Subversion Repositories Integrator Subversion

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1 espaco 1
var FormEditable = function () {
2
 
3
    $.mockjaxSettings.responseTime = 500;
4
 
5
    var log = function (settings, response) {
6
        var s = [],
7
            str;
8
        s.push(settings.type.toUpperCase() + ' url = "' + settings.url + '"');
9
        for (var a in settings.data) {
10
            if (settings.data[a] && typeof settings.data[a] === 'object') {
11
                str = [];
12
                for (var j in settings.data[a]) {
13
                    str.push(j + ': "' + settings.data[a][j] + '"');
14
                }
15
                str = '{ ' + str.join(', ') + ' }';
16
            } else {
17
                str = '"' + settings.data[a] + '"';
18
            }
19
            s.push(a + ' = ' + str);
20
        }
21
        s.push('RESPONSE: status = ' + response.status);
22
 
23
        if (response.responseText) {
24
            if ($.isArray(response.responseText)) {
25
                s.push('[');
26
                $.each(response.responseText, function (i, v) {
27
                    s.push('{value: ' + v.value + ', text: "' + v.text + '"}');
28
                });
29
                s.push(']');
30
            } else {
31
                s.push($.trim(response.responseText));
32
            }
33
        }
34
        s.push('--------------------------------------\n');
35
        $('#console').val(s.join('\n') + $('#console').val());
36
    }
37
 
38
    var initAjaxMock = function () {
39
        //ajax mocks
40
 
41
        $.mockjax({
42
            url: '/post',
43
            response: function (settings) {
44
                log(settings, this);
45
            }
46
        });
47
 
48
        $.mockjax({
49
            url: '/error',
50
            status: 400,
51
            statusText: 'Bad Request',
52
            response: function (settings) {
53
                this.responseText = 'Please input correct value';
54
                log(settings, this);
55
            }
56
        });
57
 
58
        $.mockjax({
59
            url: '/status',
60
            status: 500,
61
            response: function (settings) {
62
                this.responseText = 'Internal Server Error';
63
                log(settings, this);
64
            }
65
        });
66
 
67
        $.mockjax({
68
            url: '/groups',
69
            response: function (settings) {
70
                this.responseText = [{
71
                        value: 0,
72
                        text: 'Guest'
73
                    }, {
74
                        value: 1,
75
                        text: 'Service'
76
                    }, {
77
                        value: 2,
78
                        text: 'Customer'
79
                    }, {
80
                        value: 3,
81
                        text: 'Operator'
82
                    }, {
83
                        value: 4,
84
                        text: 'Support'
85
                    }, {
86
                        value: 5,
87
                        text: 'Admin'
88
                    }
89
                ];
90
                log(settings, this);
91
            }
92
        });
93
 
94
    }
95
 
96
    var initEditables = function () {
97
 
98
        //set editable mode based on URL parameter
99
        if (Metronic.getURLParameter('mode') == 'inline') {
100
            $.fn.editable.defaults.mode = 'inline';
101
            $('#inline').attr("checked", true);
102
            jQuery.uniform.update('#inline');
103
        } else {
104
            $('#inline').attr("checked", false);
105
            jQuery.uniform.update('#inline');
106
        }
107
 
108
        //global settings 
109
        $.fn.editable.defaults.inputclass = 'form-control';
110
        $.fn.editable.defaults.url = '/post';
111
 
112
        //editables element samples 
113
        $('#username').editable({
114
            url: '/post',
115
            type: 'text',
116
            pk: 1,
117
            name: 'username',
118
            title: 'Enter username'
119
        });
120
 
121
        $('#firstname').editable({
122
            validate: function (value) {
123
                if ($.trim(value) == '') return 'This field is required';
124
            }
125
        });
126
 
127
        $('#sex').editable({
128
            prepend: "not selected",
129
            inputclass: 'form-control',
130
            source: [{
131
                    value: 1,
132
                    text: 'Male'
133
                }, {
134
                    value: 2,
135
                    text: 'Female'
136
                }
137
            ],
138
            display: function (value, sourceData) {
139
                var colors = {
140
                    "": "gray",
141
                    1: "green",
142
                    2: "blue"
143
                },
144
                    elem = $.grep(sourceData, function (o) {
145
                        return o.value == value;
146
                    });
147
 
148
                if (elem.length) {
149
                    $(this).text(elem[0].text).css("color", colors[value]);
150
                } else {
151
                    $(this).empty();
152
                }
153
            }
154
        });
155
 
156
        $('#status').editable();
157
 
158
        $('#group').editable({
159
            showbuttons: false
160
        });
161
 
162
        $('#vacation').editable({
163
            rtl : Metronic.isRTL()
164
        });
165
 
166
        $('#dob').editable({
167
            inputclass: 'form-control',
168
        });
169
 
170
        $('#event').editable({
171
            placement: (Metronic.isRTL() ? 'left' : 'right'),
172
            combodate: {
173
                firstItem: 'name'
174
            }
175
        });
176
 
177
        $('#meeting_start').editable({
178
            format: 'yyyy-mm-dd hh:ii',
179
            viewformat: 'dd/mm/yyyy hh:ii',
180
            validate: function (v) {
181
                if (v && v.getDate() == 10) return 'Day cant be 10!';
182
            },
183
            datetimepicker: {
184
                rtl : Metronic.isRTL(),
185
                todayBtn: 'linked',
186
                weekStart: 1
187
            }
188
        });
189
 
190
        $('#comments').editable({
191
            showbuttons: 'bottom'
192
        });
193
 
194
        $('#note').editable({
195
            showbuttons : (Metronic.isRTL() ? 'left' : 'right')
196
        });
197
 
198
        $('#pencil').click(function (e) {
199
            e.stopPropagation();
200
            e.preventDefault();
201
            $('#note').editable('toggle');
202
        });
203
 
204
        $('#state').editable({
205
            source: ["Alabama", "Alaska", "Arizona", "Arkansas", "California", "Colorado", "Connecticut", "Delaware", "Florida", "Georgia", "Hawaii", "Idaho", "Illinois", "Indiana", "Iowa", "Kansas", "Kentucky", "Louisiana", "Maine", "Maryland", "Massachusetts", "Michigan", "Minnesota", "Mississippi", "Missouri", "Montana", "Nebraska", "Nevada", "New Hampshire", "New Jersey", "New Mexico", "New York", "North Dakota", "North Carolina", "Ohio", "Oklahoma", "Oregon", "Pennsylvania", "Rhode Island", "South Carolina", "South Dakota", "Tennessee", "Texas", "Utah", "Vermont", "Virginia", "Washington", "West Virginia", "Wisconsin", "Wyoming"]
206
        });
207
 
208
        $('#fruits').editable({
209
            pk: 1,
210
            limit: 3,
211
            source: [{
212
                    value: 1,
213
                    text: 'banana'
214
                }, {
215
                    value: 2,
216
                    text: 'peach'
217
                }, {
218
                    value: 3,
219
                    text: 'apple'
220
                }, {
221
                    value: 4,
222
                    text: 'watermelon'
223
                }, {
224
                    value: 5,
225
                    text: 'orange'
226
                }
227
            ]
228
        });
229
 
230
        $('#fruits').on('shown', function(e, reason) {
231
            Metronic.initUniform();
232
        });
233
 
234
        $('#tags').editable({
235
            inputclass: 'form-control input-medium',
236
            select2: {
237
                tags: ['html', 'javascript', 'css', 'ajax'],
238
                tokenSeparators: [",", " "]
239
            }
240
        });
241
 
242
        var countries = [];
243
        $.each({
244
            "BD": "Bangladesh",
245
            "BE": "Belgium",
246
            "BF": "Burkina Faso",
247
            "BG": "Bulgaria",
248
            "BA": "Bosnia and Herzegovina",
249
            "BB": "Barbados",
250
            "WF": "Wallis and Futuna",
251
            "BL": "Saint Bartelemey",
252
            "BM": "Bermuda",
253
            "BN": "Brunei Darussalam",
254
            "BO": "Bolivia",
255
            "BH": "Bahrain",
256
            "BI": "Burundi",
257
            "BJ": "Benin",
258
            "BT": "Bhutan",
259
            "JM": "Jamaica",
260
            "BV": "Bouvet Island",
261
            "BW": "Botswana",
262
            "WS": "Samoa",
263
            "BR": "Brazil",
264
            "BS": "Bahamas",
265
            "JE": "Jersey",
266
            "BY": "Belarus",
267
            "O1": "Other Country",
268
            "LV": "Latvia",
269
            "RW": "Rwanda",
270
            "RS": "Serbia",
271
            "TL": "Timor-Leste",
272
            "RE": "Reunion",
273
            "LU": "Luxembourg",
274
            "TJ": "Tajikistan",
275
            "RO": "Romania",
276
            "PG": "Papua New Guinea",
277
            "GW": "Guinea-Bissau",
278
            "GU": "Guam",
279
            "GT": "Guatemala",
280
            "GS": "South Georgia and the South Sandwich Islands",
281
            "GR": "Greece",
282
            "GQ": "Equatorial Guinea",
283
            "GP": "Guadeloupe",
284
            "JP": "Japan",
285
            "GY": "Guyana",
286
            "GG": "Guernsey",
287
            "GF": "French Guiana",
288
            "GE": "Georgia",
289
            "GD": "Grenada",
290
            "GB": "United Kingdom",
291
            "GA": "Gabon",
292
            "SV": "El Salvador",
293
            "GN": "Guinea",
294
            "GM": "Gambia",
295
            "GL": "Greenland",
296
            "GI": "Gibraltar",
297
            "GH": "Ghana",
298
            "OM": "Oman",
299
            "TN": "Tunisia",
300
            "JO": "Jordan",
301
            "HR": "Croatia",
302
            "HT": "Haiti",
303
            "HU": "Hungary",
304
            "HK": "Hong Kong",
305
            "HN": "Honduras",
306
            "HM": "Heard Island and McDonald Islands",
307
            "VE": "Venezuela",
308
            "PR": "Puerto Rico",
309
            "PS": "Palestinian Territory",
310
            "PW": "Palau",
311
            "PT": "Portugal",
312
            "SJ": "Svalbard and Jan Mayen",
313
            "PY": "Paraguay",
314
            "IQ": "Iraq",
315
            "PA": "Panama",
316
            "PF": "French Polynesia",
317
            "BZ": "Belize",
318
            "PE": "Peru",
319
            "PK": "Pakistan",
320
            "PH": "Philippines",
321
            "PN": "Pitcairn",
322
            "TM": "Turkmenistan",
323
            "PL": "Poland",
324
            "PM": "Saint Pierre and Miquelon",
325
            "ZM": "Zambia",
326
            "EH": "Western Sahara",
327
            "RU": "Russian Federation",
328
            "EE": "Estonia",
329
            "EG": "Egypt",
330
            "TK": "Tokelau",
331
            "ZA": "South Africa",
332
            "EC": "Ecuador",
333
            "IT": "Italy",
334
            "VN": "Vietnam",
335
            "SB": "Solomon Islands",
336
            "EU": "Europe",
337
            "ET": "Ethiopia",
338
            "SO": "Somalia",
339
            "ZW": "Zimbabwe",
340
            "SA": "Saudi Arabia",
341
            "ES": "Spain",
342
            "ER": "Eritrea",
343
            "ME": "Montenegro",
344
            "MD": "Moldova, Republic of",
345
            "MG": "Madagascar",
346
            "MF": "Saint Martin",
347
            "MA": "Morocco",
348
            "MC": "Monaco",
349
            "UZ": "Uzbekistan",
350
            "MM": "Myanmar",
351
            "ML": "Mali",
352
            "MO": "Macao",
353
            "MN": "Mongolia",
354
            "MH": "Marshall Islands",
355
            "MK": "Macedonia",
356
            "MU": "Mauritius",
357
            "MT": "Malta",
358
            "MW": "Malawi",
359
            "MV": "Maldives",
360
            "MQ": "Martinique",
361
            "MP": "Northern Mariana Islands",
362
            "MS": "Montserrat",
363
            "MR": "Mauritania",
364
            "IM": "Isle of Man",
365
            "UG": "Uganda",
366
            "TZ": "Tanzania, United Republic of",
367
            "MY": "Malaysia",
368
            "MX": "Mexico",
369
            "IL": "Israel",
370
            "FR": "France",
371
            "IO": "British Indian Ocean Territory",
372
            "FX": "France, Metropolitan",
373
            "SH": "Saint Helena",
374
            "FI": "Finland",
375
            "FJ": "Fiji",
376
            "FK": "Falkland Islands (Malvinas)",
377
            "FM": "Micronesia, Federated States of",
378
            "FO": "Faroe Islands",
379
            "NI": "Nicaragua",
380
            "NL": "Netherlands",
381
            "NO": "Norway",
382
            "NA": "Namibia",
383
            "VU": "Vanuatu",
384
            "NC": "New Caledonia",
385
            "NE": "Niger",
386
            "NF": "Norfolk Island",
387
            "NG": "Nigeria",
388
            "NZ": "New Zealand",
389
            "NP": "Nepal",
390
            "NR": "Nauru",
391
            "NU": "Niue",
392
            "CK": "Cook Islands",
393
            "CI": "Cote d'Ivoire",
394
            "CH": "Switzerland",
395
            "CO": "Colombia",
396
            "CN": "China",
397
            "CM": "Cameroon",
398
            "CL": "Chile",
399
            "CC": "Cocos (Keeling) Islands",
400
            "CA": "Canada",
401
            "CG": "Congo",
402
            "CF": "Central African Republic",
403
            "CD": "Congo, The Democratic Republic of the",
404
            "CZ": "Czech Republic",
405
            "CY": "Cyprus",
406
            "CX": "Christmas Island",
407
            "CR": "Costa Rica",
408
            "CV": "Cape Verde",
409
            "CU": "Cuba",
410
            "SZ": "Swaziland",
411
            "SY": "Syrian Arab Republic",
412
            "KG": "Kyrgyzstan",
413
            "KE": "Kenya",
414
            "SR": "Suriname",
415
            "KI": "Kiribati",
416
            "KH": "Cambodia",
417
            "KN": "Saint Kitts and Nevis",
418
            "KM": "Comoros",
419
            "ST": "Sao Tome and Principe",
420
            "SK": "Slovakia",
421
            "KR": "Korea, Republic of",
422
            "SI": "Slovenia",
423
            "KP": "Korea, Democratic People's Republic of",
424
            "KW": "Kuwait",
425
            "SN": "Senegal",
426
            "SM": "San Marino",
427
            "SL": "Sierra Leone",
428
            "SC": "Seychelles",
429
            "KZ": "Kazakhstan",
430
            "KY": "Cayman Islands",
431
            "SG": "Singapore",
432
            "SE": "Sweden",
433
            "SD": "Sudan",
434
            "DO": "Dominican Republic",
435
            "DM": "Dominica",
436
            "DJ": "Djibouti",
437
            "DK": "Denmark",
438
            "VG": "Virgin Islands, British",
439
            "DE": "Germany",
440
            "YE": "Yemen",
441
            "DZ": "Algeria",
442
            "US": "United States",
443
            "UY": "Uruguay",
444
            "YT": "Mayotte",
445
            "UM": "United States Minor Outlying Islands",
446
            "LB": "Lebanon",
447
            "LC": "Saint Lucia",
448
            "LA": "Lao People's Democratic Republic",
449
            "TV": "Tuvalu",
450
            "TW": "Taiwan",
451
            "TT": "Trinidad and Tobago",
452
            "TR": "Turkey",
453
            "LK": "Sri Lanka",
454
            "LI": "Liechtenstein",
455
            "A1": "Anonymous Proxy",
456
            "TO": "Tonga",
457
            "LT": "Lithuania",
458
            "A2": "Satellite Provider",
459
            "LR": "Liberia",
460
            "LS": "Lesotho",
461
            "TH": "Thailand",
462
            "TF": "French Southern Territories",
463
            "TG": "Togo",
464
            "TD": "Chad",
465
            "TC": "Turks and Caicos Islands",
466
            "LY": "Libyan Arab Jamahiriya",
467
            "VA": "Holy See (Vatican City State)",
468
            "VC": "Saint Vincent and the Grenadines",
469
            "AE": "United Arab Emirates",
470
            "AD": "Andorra",
471
            "AG": "Antigua and Barbuda",
472
            "AF": "Afghanistan",
473
            "AI": "Anguilla",
474
            "VI": "Virgin Islands, U.S.",
475
            "IS": "Iceland",
476
            "IR": "Iran, Islamic Republic of",
477
            "AM": "Armenia",
478
            "AL": "Albania",
479
            "AO": "Angola",
480
            "AN": "Netherlands Antilles",
481
            "AQ": "Antarctica",
482
            "AP": "Asia/Pacific Region",
483
            "AS": "American Samoa",
484
            "AR": "Argentina",
485
            "AU": "Australia",
486
            "AT": "Austria",
487
            "AW": "Aruba",
488
            "IN": "India",
489
            "AX": "Aland Islands",
490
            "AZ": "Azerbaijan",
491
            "IE": "Ireland",
492
            "ID": "Indonesia",
493
            "UA": "Ukraine",
494
            "QA": "Qatar",
495
            "MZ": "Mozambique"
496
        }, function (k, v) {
497
            countries.push({
498
                id: k,
499
                text: v
500
            });
501
        });
502
 
503
        $('#country').editable({
504
            inputclass: 'form-control input-medium',
505
            source: countries
506
        });
507
 
508
        $('#address').editable({
509
            url: '/post',
510
            value: {
511
                city: "San Francisco",
512
                street: "Valencia",
513
                building: "#24"
514
            },
515
            validate: function (value) {
516
                if (value.city == '') return 'city is required!';
517
            },
518
            display: function (value) {
519
                if (!value) {
520
                    $(this).empty();
521
                    return;
522
                }
523
                var html = '<b>' + $('<div>').text(value.city).html() + '</b>, ' + $('<div>').text(value.street).html() + ' st., bld. ' + $('<div>').text(value.building).html();
524
                $(this).html(html);
525
            }
526
        });
527
    }
528
 
529
    return {
530
        //main function to initiate the module
531
        init: function () {
532
 
533
            // inii ajax simulation
534
            initAjaxMock();
535
 
536
            // init editable elements
537
            initEditables();
538
 
539
            // init editable toggler
540
            $('#enable').click(function () {
541
                $('#user .editable').editable('toggleDisabled');
542
            });
543
 
544
            // init 
545
            $('#inline').on('change', function (e) {
546
                if ($(this).is(':checked')) {
547
                    window.location.href = 'form_editable.html?mode=inline';
548
                } else {
549
                    window.location.href = 'form_editable.html';
550
                }
551
            });
552
 
553
            // handle editable elements on hidden event fired
554
            $('#user .editable').on('hidden', function (e, reason) {
555
                if (reason === 'save' || reason === 'nochange') {
556
                    var $next = $(this).closest('tr').next().find('.editable');
557
                    if ($('#autoopen').is(':checked')) {
558
                        setTimeout(function () {
559
                            $next.editable('show');
560
                        }, 300);
561
                    } else {
562
                        $next.focus();
563
                    }
564
                }
565
            });
566
 
567
 
568
        }
569
 
570
    };
571
 
572
}();