ecd2734209c4a2028158581a709dcd834f692c0d
[redakcja.git] / project / static / js / views / xml.js
1 /*global View CodeMirror ButtonToolbarView render_template panels */
2 var XMLView = View.extend({
3   _className: 'XMLView',
4   element: null,
5   model: null,
6   template: 'xml-view-template',
7   editor: null,
8   buttonToolbar: null,
9   
10   init: function(element, model, parent, template) {
11     this._super(element, model, template);
12     this.parent = parent;
13     this.buttonToolbar = new ButtonToolbarView(
14       $('.xmlview-toolbar', this.element), 
15       this.model.toolbarButtonsModel);
16
17     this.parent.freeze('Ɓadowanie edytora...');
18         this.editor = new CodeMirror($('.xmlview', this.element).get(0), {
19       parserfile: 'parsexml.js',
20       path: "/static/js/lib/codemirror/",
21       stylesheet: "/static/css/xmlcolors.css",
22       parserConfig: {useHTMLKludges: false},
23       textWrapping: false,
24       tabMode: 'spaces',
25       indentUnit: 0,
26       onChange: this.editorDataChanged.bind(this),
27       initCallback: this.editorDidLoad.bind(this)
28     });
29   },
30   
31   editorDidLoad: function(editor) {
32     $(editor.frame).css({width: '100%', height: '100%'});
33     this.model
34       .addObserver(this, 'data', this.modelDataChanged.bind(this))
35       .addObserver(this, 'synced', this.modelSyncChanged.bind(this));
36     
37     this.parent.unfreeze();
38       
39     this.editor.setCode(this.model.get('data'));
40     if (!this.model.get('synced')) {
41       this.parent.freeze('Niezsynchronizowany...');
42       this.model.load();
43     }
44     
45     // editor.grabKeys(
46     //   $.fbind(self, self.hotkeyPressed),
47     //   $.fbind(self, self.isHotkey)
48     // );
49   },
50   
51   editorDataChanged: function() {
52     this.model.set('data', this.editor.getCode());
53   },
54   
55   modelDataChanged: function(property, value) {
56     if (this.editor.getCode() != value) {
57       this.editor.setCode(value);
58     }
59   },
60   
61   modelSyncChanged: function(property, value) {
62     if (value) {
63       this.parent.unfreeze();
64     } else {
65       this.parent.freeze('Niezsynchronizowany...');
66     }
67   },
68     
69   dispose: function() {
70     this.model.removeObserver(this);
71     $(this.editor.frame).remove();
72     this._super();
73   }
74 });
75
76 // Register view
77 panels['xml'] = XMLView;