From: Aleksander Łukasz <aleksander.lukasz@nowoczesnapolska.org.pl>
Date: Sun, 23 Mar 2014 18:53:36 +0000 (+0100)
Subject: editor: refactoring - move dialog view implementation out of data module
X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/413a5f1dc25d5c8a788127f40816f39c49cd0d1c

editor: refactoring - move dialog view implementation out of data module
---

diff --git a/src/editor/modules/data/data.js b/src/editor/modules/data/data.js
index 42e46f8..3bb2c2c 100644
--- a/src/editor/modules/data/data.js
+++ b/src/editor/modules/data/data.js
@@ -1,6 +1,6 @@
 define([
     'libs/jquery',
-    './dialog',
+    'views/dialog/dialog',
     'wlxml/wlxml',
     'wlxml/extensions/list/list',
     'fnpjs/logging/logging',
diff --git a/src/editor/modules/data/data.less b/src/editor/modules/data/data.less
deleted file mode 100644
index 2a21630..0000000
--- a/src/editor/modules/data/data.less
+++ /dev/null
@@ -1 +0,0 @@
-@import 'dialog.less';
\ No newline at end of file
diff --git a/src/editor/modules/data/dialog.html b/src/editor/modules/data/dialog.html
deleted file mode 100644
index 80c9fb2..0000000
--- a/src/editor/modules/data/dialog.html
+++ /dev/null
@@ -1,12 +0,0 @@
-<div class="rng-dialog modal hide static">
-    <div class="modal-header">
-        <button type="button" class="close">&times;</button>
-        <h1><%= title %></h1>
-    </div>
-    <div class="modal-body">
-    </div>
-    <div class="modal-footer">
-        <a href="#" class="btn btn-info btn-mini execute-btn"><%= executeButtonText %></a>
-        <a href="#" class="btn btn-danger btn-mini cancel-btn"><%= cancelButtonText %></a>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/editor/modules/data/dialog.js b/src/editor/modules/data/dialog.js
deleted file mode 100644
index 0d4bbd4..0000000
--- a/src/editor/modules/data/dialog.js
+++ /dev/null
@@ -1,96 +0,0 @@
-define(function(require) {
-
-    /* globals gettext */
-    'use strict';
-
-    var _ = require('libs/underscore'),
-        Backbone = require('libs/backbone'),
-        dialogTemplate = require('libs/text!./dialog.html'),
-        fieldTemplates = {};
-        fieldTemplates.checkbox = require('libs/text!./templates/checkbox.html');
-        fieldTemplates.select = require('libs/text!./templates/select.html');
-        fieldTemplates.textarea = require('libs/text!./templates/textarea.html');
-        fieldTemplates.input = require('libs/text!./templates/input.html');
-
-
-
-    var DialogView = Backbone.View.extend({
-        template: _.template(dialogTemplate),
-        events: {
-            'click .execute-btn': 'onExecute',
-            'click .cancel-btn': 'onCancel',
-            'click .close': 'close'
-        },
-        initialize: function() {
-            _.bindAll(this);
-            this.actionsDisabled = false;
-        },
-        show: function() {
-            this.setElement(this.template(_.extend({
-                executeButtonText: gettext('Submit'),
-                cancelButtonText: gettext('Cancel')
-            }, this.options)));
-
-            var body = this.$('.modal-body');
-            (this.options.fields || []).forEach(function(field) {
-                var template = fieldTemplates[field.type];
-                if(!template) {
-                    throw new Error('Field type {type} not recognized.'.replace('{type}', field.type));
-                }
-                body.append(
-                    _.template(template)(_.extend({description: ''}, field))
-                );
-            });
-
-            if(this.options.text) {
-                body.append('<p>' + this.options.text + '</p>');
-            }
-
-            this.$el.modal({backdrop: 'static'});
-            this.$el.modal('show');
-            this.$('textarea').focus();
-        },
-        onExecute: function(e) {
-            e.preventDefault();
-            var view = this,
-                formData = {};
-
-            (this.options.fields || []).forEach(function(field) {
-                var widget = view.$('[name=' + field.name +']');
-                formData[field.name] = widget.val();
-            });
-
-            this.trigger('execute', {
-                formData: formData,
-                success: function() { view.actionsDisabled = false; view.close(); },
-                error: function() { view.actionsDisabled = false; view.close(); },
-            });
-        },
-        onCancel: function() {
-            this.trigger('cancel');
-            this.close();
-        },
-        close: function(e) {
-            if(e) {
-                e.preventDefault();
-            }
-            if(!this.actionsDisabled) {
-                this.$el.modal('hide');
-                this.$el.remove();
-            }
-            this.trigger('close');
-        },
-        toggleButtons: function(toggle) {
-            this.$('.btn, button').toggleClass('disabled', !toggle);
-            this.$('textarea').attr('disabled', !toggle);
-            this.actionsDisabled = !toggle;
-        }
-    });
-
-    return {
-        create: function(config) {
-            return new DialogView(config);
-        }
-    };
-
-});
\ No newline at end of file
diff --git a/src/editor/modules/data/dialog.less b/src/editor/modules/data/dialog.less
deleted file mode 100644
index 8128162..0000000
--- a/src/editor/modules/data/dialog.less
+++ /dev/null
@@ -1,25 +0,0 @@
-.rng-dialog {
-    textarea {
-        padding: 3px 3px;
-        margin: 5px auto;
-        width: 95%;
-        display: block;
-    }
-    
-    h1, label {
-        font-size: 12px;
-        line-height: 12px;
-
-    }
-    
-    h1 {
-        margin: 2px 5px;
-        font-weight: bold;
-    }
-
-    .description {
-        font-size: .8em;
-    }
-
-    width: 620px;
-}
\ No newline at end of file
diff --git a/src/editor/modules/data/templates/checkbox.html b/src/editor/modules/data/templates/checkbox.html
deleted file mode 100644
index 3c14092..0000000
--- a/src/editor/modules/data/templates/checkbox.html
+++ /dev/null
@@ -1,5 +0,0 @@
-<p>
-    <div style="float: left; width:100px;"><%= label %>:</div>
-    <input type="checkbox" name="<%= name %>"/> 
-    <span class="description"><%= description %></span>
-</p>
\ No newline at end of file
diff --git a/src/editor/modules/data/templates/input.html b/src/editor/modules/data/templates/input.html
deleted file mode 100644
index f60f2f6..0000000
--- a/src/editor/modules/data/templates/input.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<p>
-    <div style="float: left; width:100px;">
-    <%= label %>:
-    </div>
-    <div>
-        <input type="input" name="<%= name %>"/>
-        <span class="description"><%= description %></span>
-    </div>
-    
-</p>
\ No newline at end of file
diff --git a/src/editor/modules/data/templates/select.html b/src/editor/modules/data/templates/select.html
deleted file mode 100644
index 4b5a1de..0000000
--- a/src/editor/modules/data/templates/select.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<p>
-    <div style="float: left; width:100px;"><%= label %>:</div>
-    <select name="<%= name %>">
-    <% options.forEach(function(option) { %>
-        <option value="<%= option.value %>"><%= option.text %></option>
-    <% }); %>
-    </select>
-    <span class="description"><%= description %></span>
-</p>
\ No newline at end of file
diff --git a/src/editor/modules/data/templates/textarea.html b/src/editor/modules/data/templates/textarea.html
deleted file mode 100644
index 50b7c50..0000000
--- a/src/editor/modules/data/templates/textarea.html
+++ /dev/null
@@ -1,5 +0,0 @@
-<p>
-    <label><%= label %></label>
-    <textarea name="<%= name %>" rows="5"></textarea>
-    <span class="description"><%= description %></span>
-</p>
diff --git a/src/editor/styles/main.less b/src/editor/styles/main.less
index 2792657..82bf8d5 100644
--- a/src/editor/styles/main.less
+++ b/src/editor/styles/main.less
@@ -3,7 +3,7 @@
 @import 'common.less';
 
 @import '../views/openSelect/openSelect.less';
-@import '../modules/data/data.less';
+@import '../views/dialog/dialog.less';
 @import '../modules/rng/rng.less';
 @import '../modules/documentCanvas/documentCanvas.less';
 @import '../modules/sourceEditor/sourceEditor.less';
diff --git a/src/editor/views/dialog/dialog.html b/src/editor/views/dialog/dialog.html
new file mode 100644
index 0000000..80c9fb2
--- /dev/null
+++ b/src/editor/views/dialog/dialog.html
@@ -0,0 +1,12 @@
+<div class="rng-dialog modal hide static">
+    <div class="modal-header">
+        <button type="button" class="close">&times;</button>
+        <h1><%= title %></h1>
+    </div>
+    <div class="modal-body">
+    </div>
+    <div class="modal-footer">
+        <a href="#" class="btn btn-info btn-mini execute-btn"><%= executeButtonText %></a>
+        <a href="#" class="btn btn-danger btn-mini cancel-btn"><%= cancelButtonText %></a>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/editor/views/dialog/dialog.js b/src/editor/views/dialog/dialog.js
new file mode 100644
index 0000000..0d4bbd4
--- /dev/null
+++ b/src/editor/views/dialog/dialog.js
@@ -0,0 +1,96 @@
+define(function(require) {
+
+    /* globals gettext */
+    'use strict';
+
+    var _ = require('libs/underscore'),
+        Backbone = require('libs/backbone'),
+        dialogTemplate = require('libs/text!./dialog.html'),
+        fieldTemplates = {};
+        fieldTemplates.checkbox = require('libs/text!./templates/checkbox.html');
+        fieldTemplates.select = require('libs/text!./templates/select.html');
+        fieldTemplates.textarea = require('libs/text!./templates/textarea.html');
+        fieldTemplates.input = require('libs/text!./templates/input.html');
+
+
+
+    var DialogView = Backbone.View.extend({
+        template: _.template(dialogTemplate),
+        events: {
+            'click .execute-btn': 'onExecute',
+            'click .cancel-btn': 'onCancel',
+            'click .close': 'close'
+        },
+        initialize: function() {
+            _.bindAll(this);
+            this.actionsDisabled = false;
+        },
+        show: function() {
+            this.setElement(this.template(_.extend({
+                executeButtonText: gettext('Submit'),
+                cancelButtonText: gettext('Cancel')
+            }, this.options)));
+
+            var body = this.$('.modal-body');
+            (this.options.fields || []).forEach(function(field) {
+                var template = fieldTemplates[field.type];
+                if(!template) {
+                    throw new Error('Field type {type} not recognized.'.replace('{type}', field.type));
+                }
+                body.append(
+                    _.template(template)(_.extend({description: ''}, field))
+                );
+            });
+
+            if(this.options.text) {
+                body.append('<p>' + this.options.text + '</p>');
+            }
+
+            this.$el.modal({backdrop: 'static'});
+            this.$el.modal('show');
+            this.$('textarea').focus();
+        },
+        onExecute: function(e) {
+            e.preventDefault();
+            var view = this,
+                formData = {};
+
+            (this.options.fields || []).forEach(function(field) {
+                var widget = view.$('[name=' + field.name +']');
+                formData[field.name] = widget.val();
+            });
+
+            this.trigger('execute', {
+                formData: formData,
+                success: function() { view.actionsDisabled = false; view.close(); },
+                error: function() { view.actionsDisabled = false; view.close(); },
+            });
+        },
+        onCancel: function() {
+            this.trigger('cancel');
+            this.close();
+        },
+        close: function(e) {
+            if(e) {
+                e.preventDefault();
+            }
+            if(!this.actionsDisabled) {
+                this.$el.modal('hide');
+                this.$el.remove();
+            }
+            this.trigger('close');
+        },
+        toggleButtons: function(toggle) {
+            this.$('.btn, button').toggleClass('disabled', !toggle);
+            this.$('textarea').attr('disabled', !toggle);
+            this.actionsDisabled = !toggle;
+        }
+    });
+
+    return {
+        create: function(config) {
+            return new DialogView(config);
+        }
+    };
+
+});
\ No newline at end of file
diff --git a/src/editor/views/dialog/dialog.less b/src/editor/views/dialog/dialog.less
new file mode 100644
index 0000000..8128162
--- /dev/null
+++ b/src/editor/views/dialog/dialog.less
@@ -0,0 +1,25 @@
+.rng-dialog {
+    textarea {
+        padding: 3px 3px;
+        margin: 5px auto;
+        width: 95%;
+        display: block;
+    }
+    
+    h1, label {
+        font-size: 12px;
+        line-height: 12px;
+
+    }
+    
+    h1 {
+        margin: 2px 5px;
+        font-weight: bold;
+    }
+
+    .description {
+        font-size: .8em;
+    }
+
+    width: 620px;
+}
\ No newline at end of file
diff --git a/src/editor/views/dialog/templates/checkbox.html b/src/editor/views/dialog/templates/checkbox.html
new file mode 100644
index 0000000..3c14092
--- /dev/null
+++ b/src/editor/views/dialog/templates/checkbox.html
@@ -0,0 +1,5 @@
+<p>
+    <div style="float: left; width:100px;"><%= label %>:</div>
+    <input type="checkbox" name="<%= name %>"/> 
+    <span class="description"><%= description %></span>
+</p>
\ No newline at end of file
diff --git a/src/editor/views/dialog/templates/input.html b/src/editor/views/dialog/templates/input.html
new file mode 100644
index 0000000..f60f2f6
--- /dev/null
+++ b/src/editor/views/dialog/templates/input.html
@@ -0,0 +1,10 @@
+<p>
+    <div style="float: left; width:100px;">
+    <%= label %>:
+    </div>
+    <div>
+        <input type="input" name="<%= name %>"/>
+        <span class="description"><%= description %></span>
+    </div>
+    
+</p>
\ No newline at end of file
diff --git a/src/editor/views/dialog/templates/select.html b/src/editor/views/dialog/templates/select.html
new file mode 100644
index 0000000..4b5a1de
--- /dev/null
+++ b/src/editor/views/dialog/templates/select.html
@@ -0,0 +1,9 @@
+<p>
+    <div style="float: left; width:100px;"><%= label %>:</div>
+    <select name="<%= name %>">
+    <% options.forEach(function(option) { %>
+        <option value="<%= option.value %>"><%= option.text %></option>
+    <% }); %>
+    </select>
+    <span class="description"><%= description %></span>
+</p>
\ No newline at end of file
diff --git a/src/editor/views/dialog/templates/textarea.html b/src/editor/views/dialog/templates/textarea.html
new file mode 100644
index 0000000..50b7c50
--- /dev/null
+++ b/src/editor/views/dialog/templates/textarea.html
@@ -0,0 +1,5 @@
+<p>
+    <label><%= label %></label>
+    <textarea name="<%= name %>" rows="5"></textarea>
+    <span class="description"><%= description %></span>
+</p>