From: zuber <marek@stepniowski.com>
Date: Sun, 27 Sep 2009 12:38:03 +0000 (+0200)
Subject: Dodanie ButtonToolbarView.
X-Git-Url: https://git.mdrn.pl/redakcja.git/commitdiff_plain/38747104cc8581d642f3c5a0d78c17565cc9988c?ds=sidebyside;hp=-c

Dodanie ButtonToolbarView.
---

38747104cc8581d642f3c5a0d78c17565cc9988c
diff --git a/project/static/js/models.js b/project/static/js/models.js
index 5c5e6fb1..96cab868 100644
--- 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
index 00000000..ef3af784
--- /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 fd670401..ecd27342 100644
--- 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 548b7685..0c3e3a66 100644
--- 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 %}