Subversion-Projekte lars-tiefland.cienc

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

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