PageRenderTime 27ms CodeModel.GetById 1ms app.highlight 22ms RepoModel.GetById 1ms app.codeStats 0ms

/static/js/course_res.js

https://bitbucket.org/NickyHuang5293/ulip
JavaScript | 470 lines | 370 code | 84 blank | 16 comment | 16 complexity | be4d6944c1e55aef3b8291a0035de45f MD5 | raw file
  1/**
  2 * Created by PyCharm.
  3 * User: Administrator
  4 * Date: 12-5-3
  5 * Time: 下午9:10
  6 * To change this template use File | Settings | File Templates.
  7 */
  8(function(){
  9    /****************************************BOOK RESOURCE START********************************/
 10
 11    //define model "ResBook"
 12    window.ResBook = Backbone.Model.extend({
 13        urlRoot: RES_BOOK_API,
 14        idAttribute:'book_id'
 15    });
 16
 17    window.BookCollection = Backbone.Collection.extend({
 18        model: ResBook,
 19        urlRoot: RES_BOOK_API,
 20
 21        maybeFetch : function(options){
 22            if(this._fetched){
 23                options.success && options.success();
 24                return;
 25            }
 26            var self = this;
 27            var successWrapper = function(success){
 28                return function(){
 29                    self._fetched = true;
 30                    success && success.apply(this,arguments);
 31                };
 32            };
 33            options.success = successWrapper(options.success);
 34            this.fetch(options);
 35        }
 36
 37    });
 38
 39    window.BookUnitView = Backbone.View.extend({
 40        tagName: 'div',
 41        className: 'unit-block',
 42
 43        events: {
 44            'click .delete-book': 'clear',
 45            'click .edit-book': 'edit',
 46            'click .edit-book-panel .save-modify': 'save_modify',
 47            'click .edit-book-panel .cancel-modify': 'cancel_modify',
 48            'click .unit-info, .book-detail-panel .book-slideup': 'ctrlDetailPanel'
 49        },
 50
 51        initialize: function(){
 52            this.model.bind('change', this.render, this);
 53            this.model.bind('destroy', this.remove, this);
 54
 55            $(this.el).data("detail_state","hide");
 56        },
 57
 58        clear: function(e){
 59            e.preventDefault();
 60           this.model.destroy({
 61               success: function(){ },
 62               error: function(){ alert("delete failed!"); },
 63               wait:true
 64           });
 65        },
 66
 67        showBookPanel: function(){
 68            this.$(".unit-info").hide();
 69            this.$(".edit-book-panel").slideDown();
 70        },
 71
 72        hideBookPanel: function(){
 73            this.$(".edit-book-panel").slideUp();
 74            this.$(".unit-info").show();
 75        },
 76
 77        edit: function(e){
 78            e.preventDefault();
 79            //init editor value
 80            if(this.model.get('isRequired'))
 81                this.$('.edit-book-panel .res-required #book-required').attr("checked","checked");
 82            else
 83                this.$('.edit-book-panel .res-required #book-supplemental').attr("checked","checked");
 84
 85            this.$('.edit-book-panel .res-book-info #title').val(this.model.get('book_title'));
 86            this.$('.edit-book-panel .res-book-info #author').val(this.model.get('book_author'));
 87            this.$('.edit-book-panel .res-desc #textContent').val(this.model.get('description'));
 88
 89            if($(this.el).data("detail_state")=="show"){
 90                this.hideDetailPanel(e);
 91                $(this.el).data("detail_state","hide");
 92            }
 93            this.showBookPanel();
 94            e.stopPropagation();
 95        },
 96
 97        save_modify: function(){
 98            var obj = {};
 99            obj['isRequired'] = this.$('#book-required').prop('checked');
100            obj['book_title'] = this.$('#title').val();
101            obj['book_author'] = this.$('#author').val();
102            obj['description'] = this.$('#textContent').val();
103            this.model.save(obj);
104
105            this.hideBookPanel();
106        },
107
108        cancel_modify: function(){
109            this.hideBookPanel();
110        },
111
112        ctrlDetailPanel: function(e){
113            e.preventDefault();
114
115            if($(this.el).data("detail_state")=="hide"){
116                this.showDetailPanel();
117                $(this.el).data("detail_state","show");
118            }
119            else{
120                this.hideDetailPanel();
121                $(this.el).data("detail_state","hide");
122            }
123        },
124
125        showDetailPanel: function(){
126            this.$(".book-detail-panel").slideDown();
127        },
128
129        hideDetailPanel:function(){
130            this.$(".book-detail-panel").slideUp();
131        },
132
133        render: function(){
134            var data = this.model.toJSON();
135            data.description = textToPageEncode(data.description)
136            $(this.el).html(ich.BookUnit(this.model.toJSON()));
137            this.$('.book-detail-panel .res-desc-content').html(data.description);
138            return this;
139        }
140    });
141
142    window.BookListView = Backbone.View.extend({
143
144        initialize: function(){
145            _.bindAll(this, 'addOne', 'addAll');
146
147            this.collection.bind('add', this.addOne);
148            this.collection.bind('reset', this.addAll, this);
149            this.views = [];
150        },
151
152        addAll: function(){
153            this.views = [];
154            this.collection.each(this.addOne);
155        },
156
157        addOne: function(resbook){
158
159            var view = new BookUnitView({
160                model: resbook
161            });
162            $(this.el).prepend(view.render().el);
163            this.views.push(view);
164            view.bind('all', this.rethrow, this);
165        },
166
167        rethrow: function(){
168            this.trigger.apply(this, arguments);
169        }
170    });
171    /****************************************BOOK RESOURCE END********************************/
172
173    /****************************************LINK RESOURCE START********************************/
174    //define model "ResLink"
175    window.ResLink = Backbone.Model.extend({
176        urlRoot: RES_LINK_API,
177        idAttribute:'link_id'
178    });
179
180    window.LinkCollection = Backbone.Collection.extend({
181        model: ResLink,
182        urlRoot: RES_LINK_API,
183
184         maybeFetch : function(options){
185            if(this._fetched){
186                options.success && options.success();
187                return;
188            }
189            var self = this;
190            var successWrapper = function(success){
191                return function(){
192                    self._fetched = true;
193                    success && success.apply(this,arguments);
194                };
195            };
196            options.success = successWrapper(options.success);
197            this.fetch(options);
198         }
199    });
200
201    window.LinkUnitView = Backbone.View.extend({
202        tagName: 'div',
203        className: 'unit-block',
204
205        events: {
206            'click .delete-link': 'clear',
207            'click .edit-link': 'edit',
208            'click .unit-info .name': 'view_link',
209            'click .edit-link-panel .save-modify': 'save_modify',
210            'click .edit-link-panel .cancel-modify': 'cancel_modify',
211            'click .unit-info, .link-detail-panel .link-slideup': 'ctrlDetailPanel'
212        },
213
214        initialize: function(){
215            this.model.bind('change', this.render, this);
216            this.model.bind('destroy', this.remove, this);
217
218            $(this.el).data("detail_state","hide");
219        },
220
221        clear: function(e){
222            e.preventDefault();
223            this.model.destroy({
224                success: function(){ },
225                error: function(){ alert("delete failed!"); },
226                wait:true
227            });
228        },
229
230        view_link: function(e){
231            e.stopPropagation();
232        },
233
234        showLinkPanel: function(){
235            this.$(".unit-info").hide();
236            this.$(".edit-link-panel").slideDown();
237        },
238
239        hideLinkPanel: function(){
240            this.$(".edit-link-panel").slideUp();
241            this.$(".unit-info").show();
242        },
243
244        edit: function(e){
245            e.preventDefault();
246            //init editor value
247            if(this.model.get('isRequired'))
248                this.$('.edit-link-panel .res-required #link-required').attr("checked","checked");
249            else
250                this.$('.edit-link-panel .res-required #link-supplemental').attr("checked","checked");
251
252            this.$('.edit-link-panel .res-link-info #url').val(this.model.get('link_url'));
253            this.$('.edit-link-panel .res-link-info #name').val(this.model.get('link_name'));
254            this.$('.edit-link-panel .res-desc #textContent').val(this.model.get('description'));
255
256            if($(this.el).data("detail_state")=="show"){
257                this.hideDetailPanel(e);
258                $(this.el).data("detail_state","hide");
259            }
260            this.showLinkPanel();
261            e.stopPropagation();
262        },
263
264        save_modify: function(){
265            var obj = {};
266            obj['isRequired'] = this.$('#required').prop('checked');
267            obj['link_url'] = this.$('#url').val();
268            obj['link_name'] = this.$('#name').val();
269            obj['description'] = this.$('#textContent').val();
270            this.model.save(obj);
271            this.hideLinkPanel();
272        },
273
274        cancel_modify: function(){
275            this.hideLinkPanel();
276        },
277
278        ctrlDetailPanel: function(e){
279            e.preventDefault();
280
281            if($(this.el).data("detail_state")=="hide"){
282                this.showDetailPanel();
283                $(this.el).data("detail_state","show");
284            }
285            else{
286                this.hideDetailPanel(e);
287                $(this.el).data("detail_state","hide");
288            }
289        },
290
291        showDetailPanel: function(){
292            this.$(".link-detail-panel").slideDown();
293        },
294
295        hideDetailPanel:function(e){
296            this.$(".link-detail-panel").slideUp();
297        },
298
299       render: function(){
300           var data = this.model.toJSON();
301           data.description = textToPageEncode(data.description);
302
303           $(this.el).html(ich.LinkUnit(this.model.toJSON()));
304           this.$('.unit-info .link-info .description').html(data.description);
305           return this;
306       }
307   });
308
309    window.LinkListView = Backbone.View.extend({
310
311        initialize: function(){
312            _.bindAll(this, 'addOne', 'addAll');
313
314            this.collection.bind('add', this.addOne);
315            this.collection.bind('reset', this.addAll, this);
316            this.views = [];
317        },
318
319        addAll: function(){
320            this.views = [];
321            this.collection.each(this.addOne);
322        },
323
324        addOne: function(reslink){
325
326            var view = new LinkUnitView({
327                model: reslink
328            });
329            $(this.el).prepend(view.render().el);
330            this.views.push(view);
331            view.bind('all', this.rethrow, this);
332        },
333
334        rethrow: function(){
335            this.trigger.apply(this, arguments);
336        }
337    });
338    /****************************************LINK RESOURCE END********************************/
339    window.ResEditorView = Backbone.View.extend({
340        events:{
341            'click .book-opt': 'showBookPanel',
342            'click .new-book-panel .cancel' : 'hideBookPanel',
343            'click .new-book-panel .save': 'createResBook',
344
345            'click .link-opt': 'showLinkPanel',
346            'click .new-link-panel .cancel' : 'hideLinkPanel',
347            'click .new-link-panel .save': 'createResLink'
348        },
349
350        showBookPanel: function(){
351            this.resetBook();
352            $(".type-selector").hide();
353            $(".new-book-panel").slideDown();
354        },
355
356        hideBookPanel: function(){
357            $(".new-book-panel").slideUp();
358            $(".type-selector").show();
359        },
360
361        createResBook: function(){
362            var bRequired = this.$('.new-book-panel #book-required').prop('checked');
363            var title = this.$('.new-book-panel #title').val();
364            var author = this.$('.new-book-panel #author').val();
365            var desc = this.$('.new-book-panel #textContent').val();
366
367            if(title){
368                post_list_app.book_collection.create({
369                    school: SCHOOL,
370                    course: COURSE,
371                    creator: PARTICIPANT,
372                    isdeleted : false,
373                    isRequired: bRequired,
374                    book_title: title,
375                    book_author: author,
376                    description: desc
377
378                },{ wait: true});
379
380                this.hideBookPanel();
381            }
382        },
383
384        resetBook: function(){
385            this.$('.new-book-panel .res-required #book-required').attr("checked","checked");
386            this.$('.new-book-panel #title').val("书名");
387            this.$('.new-book-panel #author').val("作者");
388            this.$('.new-book-panel #textContent').val("");
389        },
390
391        showLinkPanel: function(){
392            this.resetLink();
393            $(".type-selector").hide();
394            $(".new-link-panel").slideDown();
395        },
396
397        hideLinkPanel: function(){
398            $(".new-link-panel").slideUp();
399            $(".type-selector").show();
400        },
401
402        createResLink: function(){
403
404            var bRequired = this.$('.new-link-panel #link-required').prop('checked');
405            var url = this.$('.new-link-panel #url').val();
406            var name = this.$('.new-link-panel #name').val();
407            var desc = this.$('.new-link-panel #textContent').val();
408
409            if(url && name){
410                post_list_app.link_collection.create({
411                    school: SCHOOL,
412                    course: COURSE,
413                    creator: PARTICIPANT,
414                    isdeleted : false,
415                    isRequired: bRequired,
416                    link_url: url,
417                    link_name: name,
418                    description: desc
419
420                },{ wait: true});
421
422                this.hideLinkPanel();
423            }
424        },
425
426        resetLink: function(){
427            this.$('.new-link-panel .res-required #link-required').attr("checked","checked");
428            this.$('.new-link-panel #url').val("");
429            this.$('.new-link-panel #name').val("");
430            this.$('.new-link-panel #textContent').val("");
431        },
432
433        render: function(){
434            $(this.el).html(ich.ResEditor());
435        }
436    });
437
438
439    $(function(){
440        window.post_list_app =   window.post_list_app || {};
441
442        post_list_app.book_collection = new BookCollection();
443        post_list_app.link_collection = new LinkCollection();
444
445        //initialize the post list view
446        post_list_app.booklist = new BookListView({
447            el:$(".resbook-list"),
448            collection: post_list_app.book_collection
449        });
450        post_list_app.linklist = new LinkListView({
451             el:$(".reslink-list"),
452             collection: post_list_app.link_collection
453         });
454
455        post_list_app.book_collection.maybeFetch({
456            success: _.bind(post_list_app.booklist.render, post_list_app.booklist)
457        });
458
459        post_list_app.link_collection.maybeFetch({
460            success: _.bind(post_list_app.linklist.render, post_list_app.linklist)
461        });
462
463        var newEditor = new ResEditorView({
464            el:$(".add_operation")
465        });
466        newEditor.render();
467
468    });
469})();
470