Dodanie ButtonToolbarView.

diff --git a/project/static/js/models.js b/project/static/js/models.js
index 5c5e6fb..96cab86 100644 (file)
--- a/project/static/js/models.js
+++ b/project/static/js/models.js
@@ -8,6 +8,31 @@ Editor.Model = Editor.Object.extend({
 });
 
 
+Editor.ToolbarButtonsModel = Editor.Model.extend({
+  _className: 'Editor.ToolbarButtonsModel',
+  serverURL: '/api/toolbar/buttons',
+  buttons: {},
+  
+  init: function() {
+    this._super();
+  },
+  
+  load: function() {
+    if (!this.get('buttons').length) {
+      $.ajax({
+        url: this.serverURL,
+        dataType: 'json',
+        success: this.loadSucceeded.bind(this)
+      });
+    }
+  },
+  
+  loadSucceeded: function(data) {
+    this.set('buttons', data);
+  }
+});
+
+
 Editor.XMLModel = Editor.Model.extend({
   _className: 'Editor.XMLModel',
   serverURL: null,
@@ -16,6 +41,7 @@ Editor.XMLModel = Editor.Model.extend({
   init: function(serverURL) {
     this._super();
     this.serverURL = serverURL;
+    this.toolbarButtonsModel = new Editor.ToolbarButtonsModel();
   },
   
   getData: function() {

diff --git a/project/static/js/views/button_toolbar.js b/project/static/js/views/button_toolbar.js
new file mode 100644 (file)
index 0000000..ef3af78
--- /dev/null
+++ b/project/static/js/views/button_toolbar.js
@@ -0,0 +1,58 @@
+/*globals View render_template scriptletCenter*/
+var ButtonToolbarView = View.extend({
+  _className: 'ButtonToolbarView',
+  template: null,
+  buttons: null,
+  
+  init: function(element, model, parent, template) {
+    this._super(element, model, null);
+    this.parent = parent;
+    this.template = 'button-toolbar-view-template';
+    
+    this.model.addObserver(this, 'buttons', this.modelButtonsChanged.bind(this));
+    this.buttons = this.model.get('buttons');
+    this.model.load();
+    this.render();
+  },
+  
+  modelButtonsChanged: function(property, value) {
+    this.set('buttons', value);
+    this.render();
+  },
+  
+  render: function() {
+    $('.buttontoolbarview-tab', this.element).unbind('click.buttontoolbarview');
+    $('.buttontoolbarview-button', this.element).unbind('click.buttontoolbarview');
+    
+    this.element.html(render_template(this.template, this));
+    
+    $('.buttontoolbarview-tab', this.element).bind('click.buttontoolbarview', function() {
+      var groupIndex = $(this).attr('ui:groupindex');
+      $('.buttontoolbarview-group', this.element).each(function() {
+        if ($(this).attr('ui:groupindex') == groupIndex) {
+          $(this).show();
+        } else {
+          $(this).hide();
+        }
+      });
+    });
+    
+    var self = this;
+    $('.buttontoolbarview-button', this.element).bind('click.buttontoolbarview', function() {
+      var groupIndex = parseInt($(this).attr('ui:groupindex'), 10);
+      var buttonIndex = parseInt($(this).attr('ui:buttonindex'), 10);
+      var button = self.get('buttons')[groupIndex].buttons[buttonIndex];
+      var scriptletId = button.scriptlet_id;
+      var params = eval('(' + button.params + ')'); // To nie powinno być potrzebne
+      console.log('Executing', scriptletId, 'with params', params);
+      scriptletCenter[scriptletId](self.parent, params);
+    });
+  },
+  
+  dispose: function() {
+    $('.buttontoolbarview-tab', this.element).unbind('click.buttontoolbarview');
+    $('.buttontoolbarview-button', this.element).unbind('click.buttontoolbarview');
+    this._super();
+  }
+});
+

diff --git a/project/static/js/views/xml.js b/project/static/js/views/xml.js
index fd67040..ecd2734 100644 (file)
--- a/project/static/js/views/xml.js
+++ b/project/static/js/views/xml.js
@@ -1,4 +1,4 @@
-/*global View CodeMirror render_template panels */
+/*global View CodeMirror ButtonToolbarView render_template panels */
 var XMLView = View.extend({
   _className: 'XMLView',
   element: null,
@@ -10,7 +10,10 @@ var XMLView = View.extend({
   init: function(element, model, parent, template) {
     this._super(element, model, template);
     this.parent = parent;
-    
+    this.buttonToolbar = new ButtonToolbarView(
+      $('.xmlview-toolbar', this.element), 
+      this.model.toolbarButtonsModel);
+
     this.parent.freeze('Ładowanie edytora...');
        this.editor = new CodeMirror($('.xmlview', this.element).get(0), {
       parserfile: 'parsexml.js',
@@ -27,7 +30,6 @@ var XMLView = View.extend({
   
   editorDidLoad: function(editor) {
     $(editor.frame).css({width: '100%', height: '100%'});
-    
     this.model
       .addObserver(this, 'data', this.modelDataChanged.bind(this))
       .addObserver(this, 'synced', this.modelSyncChanged.bind(this));

diff --git a/project/templates/explorer/editor.html b/project/templates/explorer/editor.html
index 548b768..0c3e3a6 100644 (file)
--- a/project/templates/explorer/editor.html
+++ b/project/templates/explorer/editor.html
@@ -12,6 +12,7 @@
        {# App and views #}
        <script src="{{STATIC_URL}}js/app.js" type="text/javascript" charset="utf-8"></script>
        <script src="{{STATIC_URL}}js/views/view.js" type="text/javascript" charset="utf-8"></script>
+       <script src="{{STATIC_URL}}js/views/button_toolbar.js" type="text/javascript" charset="utf-8"></script>
        <script src="{{STATIC_URL}}js/views/split.js" type="text/javascript" charset="utf-8"></script>
        <script src="{{STATIC_URL}}js/views/xml.js" type="text/javascript" charset="utf-8"></script>
        <script src="{{STATIC_URL}}js/views/html.js" type="text/javascript" charset="utf-8"></script>
@@ -30,7 +31,9 @@
        </script>
        
        <script type="text/html" charset="utf-8" id="xml-view-template">
+               <div class="xmlview-toolbar"></div>
                <div class="xmlview">
+                       
                </div>
        </script>
        
@@ -38,6 +41,29 @@
                <div class="htmlview">
                </div>
        </script>
+       
+       <script type="text/javascript" charset="utf-8" id="button-toolbar-view-template">
+               <div class="buttontoolbarview">
+                       <div class="buttontoolbarview-tabs">
+                       <% for (var i=0; i < buttons.length; i++) { %>
+                               <a href="#" class="buttontoolbarview-tab" ui:groupindex="<%= i %>"><%= buttons[i].name %></a>
+                       <% }; %>
+                       </div>
+                       <div class="buttontoolbarview-groups">
+                       <% for (var i=0; i < buttons.length; i++) { %>
+                               <div class="buttontoolbarview-group" ui:groupIndex="<%= i %>" style="display: none">
+                                       <% for (var j=0; j < buttons[i].buttons.length; j++) { %>
+                                               <% if (buttons[i].buttons[j].scriptlet_id) { %>
+                                               <a href="#" class="buttontoolbarview-button" ui:groupindex="<%= i %>" ui:buttonindex="<%= j %>">
+                                                       <%= buttons[i].buttons[j].label %>
+                                               </a>
+                                               <% } %>
+                                       <% } %>
+                               </div>
+                       <% }; %>
+                       </div>
+               </div>
+       </script>
 {% endblock extrahead %}
 
 {% block breadcrumbs %}<a href="{% url file_list %}">Platforma Redakcyjna</a> &gt; {{ fileid }}{% endblock breadcrumbs %}