});
+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,
init: function(serverURL) {
this._super();
this.serverURL = serverURL;
+ this.toolbarButtonsModel = new Editor.ToolbarButtonsModel();
},
getData: function() {
--- /dev/null
+/*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();
+ }
+});
+
-/*global View CodeMirror render_template panels */
+/*global View CodeMirror ButtonToolbarView render_template panels */
var XMLView = View.extend({
_className: 'XMLView',
element: null,
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',
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));
{# 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>
</script>
<script type="text/html" charset="utf-8" id="xml-view-template">
+ <div class="xmlview-toolbar"></div>
<div class="xmlview">
+
</div>
</script>
<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> > {{ fileid }}{% endblock breadcrumbs %}