Fix top bar flickering problem.
[wolnelektury.git] / apps / wolnelektury_core / static / js / dialogs.js
1 (function($) {
2     $(function() {
3
4         // create containers for all ajaxable form links
5         $('.ajaxable').each(function() {
6             var $window = $("#ajaxable-window").clone();
7             $window.attr("id", this.id + "-window");
8             $('body').append($window);
9
10             var $trigger = $(this)
11             var trigger = '#' + this.id;
12
13             $window.jqm({
14                 ajax: '@href',
15                 ajaxText: '<p><img src="' + STATIC_URL + 'img/indicator.gif" alt="*"/> ' + gettext("Loading") + '</p>',
16                 target: $('.target', $window)[0],
17                 overlay: 60,
18                 trigger: trigger,
19                 onShow: function(hash) {
20                     var offset = $(hash.t).offset();
21                     var oleft = offset.left - hash.w.width() + $(hash.t).width();
22                     if (oleft < 0) oleft = 0;
23                     hash.w.css({position: 'absolute', left: oleft, top: offset.top});
24                     var width = $(hash.t).width();
25                     width = width > 50 ? width : 50;
26                     $('.header', hash.w).css({width: width});
27                     hash.w.show();
28                 },
29                 onLoad: function(hash) {
30                     $('form', hash.w).ajaxForm({
31                         dataType: 'json',
32                         target: $('.target', $window),
33                         success: function(response) {
34                             if (response.success) {
35                                 $('.target', $window).text(response.message);
36                                 setTimeout(function() { $window.jqmHide() }, 1000);
37                                 callback = ajaxable_callbacks[$trigger.attr('data-callback')];
38                                 callback && callback($trigger, response);
39                                 if (response.redirect)
40                                     window.location = response.redirect;
41                             }
42                             else {
43                                 $('.error', $window).remove();
44                                 $.each(response.errors, function(id, errors) {
45                                     $('#id_' + id, $window).before('<span class="error">' + errors[0] + '</span>');
46                                 });
47                                 $('input[type=submit]', $window).removeAttr('disabled');
48                                 return false;
49                             }
50                         }
51                     });
52                 }
53             });
54         });
55
56
57         var login_and_retry = function($form) {
58             var $window = $("#ajaxable-window").clone();
59             $window.attr("id", "context-login-window");
60             $('body').append($window);
61
62             $window.jqm({
63                 ajax: '/uzytkownik/zaloguj-utworz/?next=' + escape(window.location),
64                 ajaxText: '<p><img src="' + STATIC_URL + 'img/indicator.gif" alt="*"/> ' + gettext("Loading") + '</p>',
65                 target: $('.target', $window)[0],
66                 overlay: 60,
67                 onShow: function(hash) {
68                     var offset = $form.offset();
69                     hash.w.css({position: 'absolute', left: offset.left - hash.w.width() + $form.width(), top: offset.top});
70                     var width = $form.width();
71                     width = width > 50 ? width : 50;
72                     $('.header', hash.w).css({width: width});
73                     hash.w.show();
74                 },
75                 onLoad: function(hash) {
76                     $('form', hash.w).ajaxForm({
77                         dataType: 'json',
78                         target: $('.target', $window),
79                         success: function(response) {
80                             if (response.success) {
81                                 $('.target', $window).text(response.message);
82                                 setTimeout(function() { $window.jqmHide() }, 1000);
83                                 $form.submit();
84                                 location.reload();
85                             }
86                             else {
87                                 $('.error', $window).remove();
88                                 $.each(response.errors, function(id, errors) {
89                                     $('#id_' + id, $window).before('<span class="error">' + errors[0] + '</span>');
90                                 });
91                                 $('input[type=submit]', $window).removeAttr('disabled');
92                                 return false;
93                             }
94                         }
95                     });
96                 }
97             }).jqmShow();
98             
99         };
100
101
102         $('.ajax-form').each(function() {
103             var $form = $(this);
104             $form.ajaxForm({
105                 dataType: 'json',
106                 beforeSubmit: function() {
107                     $('input[type=submit]', $form)
108                         .attr('disabled', 'disabled')
109                         .after('<img src="/static/img/indicator.gif" style="margin-left: 0.5em"/>');
110                 },
111                 error: function(response) {
112                         if (response.status == 403)
113                             login_and_retry($form);
114                     },
115                 success: function(response) {
116                     if (response.success) {
117                         callback = ajax_form_callbacks[$form.attr('data-callback')];
118                         callback && callback($form, response);
119
120                     } else {
121                         $('span.error', $form).remove();
122                         $.each(response.errors, function(id, errors) {
123                             $('#id_' + id, $form).before('<span class="error">' + errors[0] + '</span>');
124                         });
125                         $('input[type=submit]', $form).removeAttr('disabled');
126                         $('img', $form).remove();
127                     }
128                 }
129             });
130         });
131
132
133         var update_star = function($elem, response) {
134             /* updates the star after successful ajax */
135             var $star = $elem.closest('.star');
136             if (response.like) {
137                 $star.addClass('like');
138                 $star.removeClass('unlike');
139             }
140             else {
141                 $star.addClass('unlike');
142                 $star.removeClass('like');
143             }
144         };
145
146         var ajax_form_callbacks = {
147             'social-like-book': update_star
148         };
149
150         var ajaxable_callbacks = {
151             'social-book-sets': function() {location.reload();}
152         };
153
154
155
156     // check placeholder browser support
157     if (!Modernizr.input.placeholder)
158     {
159         // set placeholder values
160         $(this).find('[placeholder]').each(function()
161         {
162             $(this).val( $(this).attr('placeholder') ).addClass('placeholder');
163         });
164  
165         // focus and blur of placeholders
166         $('[placeholder]').focus(function()
167         {
168             if ($(this).val() == $(this).attr('placeholder'))
169             {
170                 $(this).val('');
171                 $(this).removeClass('placeholder');
172             }
173         }).blur(function()
174         {
175             if ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))
176             {
177                 $(this).val($(this).attr('placeholder'));
178                 $(this).addClass('placeholder');
179             }
180         });
181
182         // remove placeholders on submit
183         $('[placeholder]').closest('form').submit(function()
184         {
185             $(this).find('[placeholder]').each(function()
186             {
187                 if ($(this).val() == $(this).attr('placeholder'))
188                 {
189                     $(this).val('');
190                 }
191             })
192         });
193     }
194
195
196
197     });
198 })(jQuery);
199