-define(function() {\r
+define(['./data/saveDialog'], function(saveDialog) {\r
 \r
 'use strict';\r
 \r
             sandbox.publish('documentChanged', doc, reason);\r
         },\r
         saveDocument: function() {\r
-            sandbox.publish('savingStarted');\r
-            $.ajax({\r
-                method: 'post',\r
-                url: '/' + gettext('editor') + '/' + document_id,\r
-                data: JSON.stringify({document:doc}),\r
-                success: function() {sandbox.publish('savingEnded', 'success'); reloadHistory();},\r
-                error: function() {sandbox.publish('savingEnded', 'error');}\r
+\r
+            var dialog = saveDialog.create();\r
+            dialog.on('save', function(event) {\r
+                sandbox.publish('savingStarted');\r
+                dialog.toggleButtons(false);\r
+                $.ajax({\r
+                    method: 'post',\r
+                    url: '/' + gettext('editor') + '/' + document_id,\r
+                    data: JSON.stringify({document:doc, description: event.data.description}),\r
+                    success: function() {\r
+                        event.success();\r
+                        sandbox.publish('savingEnded', 'success');\r
+                        reloadHistory();\r
+                    },\r
+                    error: function() {event.error(); sandbox.publish('savingEnded', 'error');}\r
+                });\r
+                console.log('save');\r
+            });\r
+            dialog.on('cancel', function() {\r
             });\r
+            dialog.show();\r
+            \r
+\r
         },\r
         getHistory: function() {\r
             return history;\r
 
--- /dev/null
+@import 'saveDialog.less';
\ No newline at end of file
 
--- /dev/null
+<div class="rng-module-data-saveDialog modal hide static">\r
+    <div class="modal-header">\r
+        <button type="button" class="close">×</button>\r
+        <h1>Zapisz dokument</h1>\r
+    </div>\r
+    <div class="modal-body">\r
+        <label>Opisz swoje zmiany</label>\r
+        <textarea rows="5"></textarea>\r
+    </div>\r
+    <div class="modal-footer">\r
+        <a href="#" class="btn btn-info btn-mini save-btn">Zapisz</a>\r
+        <a href="#" class="btn btn-danger btn-mini cancel-btn">Anuluj</a>\r
+    </div>\r
+</div>
\ No newline at end of file
 
--- /dev/null
+define([\r
+'libs/text!./saveDialog.html',\r
+'libs/underscore-min',\r
+'libs/backbone-min',\r
+'libs/jquery-1.9.1.min'\r
+], function(saveDialogTemplate, _, Backbone, $) {\r
+\r
+    var DialogView = Backbone.View.extend({\r
+        template: _.template(saveDialogTemplate),\r
+        events: {\r
+            'click .save-btn': 'onSave',\r
+            'click .cancel-btn': 'close',\r
+            'click .close': 'close'\r
+        },\r
+        initialize: function() {\r
+            _.bindAll(this);\r
+            this.actionsDisabled = false;\r
+        },\r
+        show: function() {           \r
+            this.setElement(this.template());\r
+            this.$el.modal({backdrop: 'static'});\r
+            this.$el.modal('show');\r
+\r
+        },\r
+        onSave: function(e) {\r
+            e.preventDefault();\r
+            var view = this;\r
+            this.trigger('save', {\r
+                data: {description: view.$el.find('textarea').val()},\r
+                success: function() { view.actionsDisabled = false; view.close(); },\r
+                error: function() { view.actionsDisabled = false; view.close(); },\r
+            })\r
+        },\r
+        close: function(e) {\r
+            if(e)\r
+                e.preventDefault();\r
+            if(!this.actionsDisabled) {\r
+                this.$el.modal('hide');\r
+                this.$el.remove();\r
+            }\r
+        },\r
+        toggleButtons: function(toggle) {\r
+            this.$('.btn, button').toggleClass('disabled', !toggle);\r
+            this.actionsDisabled = !toggle;\r
+        }\r
+    });\r
+\r
+    return {\r
+        create: function() {\r
+            return new DialogView();\r
+        }\r
+    }\r
+\r
+});
\ No newline at end of file
 
--- /dev/null
+.rng-module-data-saveDialog {\r
+    textarea {\r
+        padding: 3px 3px;\r
+        margin: 5px auto;\r
+        width: 95%;\r
+        display: block;\r
+    }\r
+    \r
+    h1, label {\r
+        font-size: 12px;\r
+        line-height: 12px;\r
+\r
+    }\r
+    \r
+    h1 {\r
+        margin: 2px 5px;\r
+        font-weight: bold;\r
+    }\r
+}
\ No newline at end of file
 
 @import 'mixins.less';\r
 @import 'common.less';\r
 \r
+@import '../modules/data/data.less';\r
 @import '../modules/rng/rng.less';\r
 @import '../modules/documentCanvas/documentCanvas.less';\r
 @import '../modules/sourceEditor/sourceEditor.less';\r