update assets. Closes Nerian#6

Author: Nerian

lib/bootstrap-wysihtml5-rails/version.rb

@@ -1,5 +1,5 @@
 module BootstrapWysihtml5Rails
   module Rails
-    VERSION = "0.2.4"
+    VERSION = "0.2.5"
   end
 end

vendor/assets/javascripts/bootstrap-wysihtml5.js

@@ -19,14 +19,54 @@
 							    //,+ "<a class='btn' data-wysihtml5-command='underline' title='CTRL+U'>Underline</a>" 
 							+ "</div>" 
 						+ "</li>",
-		"lists": 		"<li>" 
-							+ "<div class='btn-group'>" 
-						    	+ "<a class='btn' data-wysihtml5-command='insertUnorderedList' title='Unordered List'><i class='icon-list'></i></a>" 
-							    + "<a class='btn' data-wysihtml5-command='insertOrderedList' title='Ordered List'><i class='icon-th-list'></i></a>" 
-							    + "<a class='btn' data-wysihtml5-command='Outdent' title='Outdent'><i class='icon-indent-right'></i></a>"  							    
-							    + "<a class='btn' data-wysihtml5-command='Indent' title='Indent'><i class='icon-indent-left'></i></a>" 
-							+ "</div>" 
-						+ "</li>",
+		"lists": 	"<li>" 
+						+ "<div class='btn-group'>" 
+					    	+ "<a class='btn' data-wysihtml5-command='insertUnorderedList' title='Unordered List'><i class='icon-list'></i></a>" 
+						    + "<a class='btn' data-wysihtml5-command='insertOrderedList' title='Ordered List'><i class='icon-th-list'></i></a>" 
+						    + "<a class='btn' data-wysihtml5-command='Outdent' title='Outdent'><i class='icon-indent-right'></i></a>"  							    
+						    + "<a class='btn' data-wysihtml5-command='Indent' title='Indent'><i class='icon-indent-left'></i></a>" 
+						+ "</div>" 
+					+ "</li>",
+
+		"link": 	"<li>" 
+						
+						+ "<div class='bootstrap-wysihtml5-insert-link-modal modal hide fade'>"
+							+ "<div class='modal-header'>"
+							+ "<a class='close' data-dismiss='modal'>×</a>"
+							  + "<h3>Insert Link</h3>"
+							+ "</div>"
+							+ "<div class='modal-body'>"
+							  + "<input value='http://' class='bootstrap-wysihtml5-insert-link-url input-xlarge'>"
+							+ "</div>"
+							+ "<div class='modal-footer'>"
+							  + "<a href='#' class='btn' data-dismiss='modal'>Cancel</a>"
+							  + "<a href='#' class='btn btn-primary' data-dismiss='modal'>Insert link</a>"
+							+ "</div>"
+						+ "</div>"
+
+				    	+ "<a class='btn' data-wysihtml5-command='createLink' title='Link'><i class='icon-share'></i></a>" 
+
+					+ "</li>",
+
+			"image": "<li>" 
+						
+						+ "<div class='bootstrap-wysihtml5-insert-image-modal modal hide fade'>"
+							+ "<div class='modal-header'>"
+							+ "<a class='close' data-dismiss='modal'>×</a>"
+							  + "<h3>Insert Image</h3>"
+							+ "</div>"
+							+ "<div class='modal-body'>"
+							  + "<input value='http://' class='bootstrap-wysihtml5-insert-link-url input-xlarge'>"
+							+ "</div>"
+							+ "<div class='modal-footer'>"
+							  + "<a href='#' class='btn' data-dismiss='modal'>Cancel</a>"
+							  + "<a href='#' class='btn btn-primary' data-dismiss='modal'>Insert image</a>"
+							+ "</div>"
+						+ "</div>"
+
+						+ "<a class='btn' data-wysihtml5-command='insertImage' title='Insert image'><i class='icon-picture'></i></a>" 
+
+					+ "</li>",
 
 		"html": 
 						"<li>"
@@ -41,6 +81,8 @@
 		"emphasis": true,
 		"lists": true,
 		"html": false,
+		"link": true,
+		"image": false,
 		events: {},
 		parserRules: {
 			tags: {
@@ -53,6 +95,14 @@
 				"h1": {},
 				"h2": {},
 				"u": 1,
+				"img": {
+					"check_attributes": {
+			            "width": "numbers",
+			            "alt": "alt",
+			            "src": "url",
+			            "height": "numbers"
+			        }
+				},
 				"a":  {
 					set_attributes: {
 						target: "_blank",
@@ -70,6 +120,8 @@
 		this.el = el;
 		this.toolbar = this.createToolbar(el, options || defaultOptions);
 		this.editor =  this.createEditor(options);
+		
+		window.editor = this.editor;
 
   		$('iframe.wysihtml5-sandbox').each(function(i, el){
 			$(el.contentWindow).off('focus.wysihtml5').on({
@@ -78,6 +130,8 @@
 			   }
 			});
 		});
+
+
 	};
 
 	Wysihtml5.prototype = {
@@ -105,11 +159,12 @@
 		},
 
 		createToolbar: function(el, options) {
+			var self = this;
 			var toolbar = $("<ul/>", {
-					id : el.attr('id') + "-wysihtml5-toolbar",
-					class : "wysihtml5-toolbar",
-					style: "display:none"
-				});
+				'id' : el.attr('id') + "-wysihtml5-toolbar",
+				'class' : "wysihtml5-toolbar",
+				'style': "display:none"
+			});
 
 			for(var key in defaultOptions) {
 				var value = false;
@@ -126,10 +181,15 @@
 					toolbar.append(templates[key]);
 
 					if(key == "html") {
-						var changeViewSelector = "a[data-wysihtml5-action='change_view']";
-						toolbar.find(changeViewSelector).click(function(e) {
-							toolbar.find('a.btn').not(changeViewSelector).toggleClass('disabled');
-						});
+						this.initHtml(toolbar);
+					}
+
+					if(key == "link") {
+						this.initInsertLink(toolbar);
+					}
+
+					if(key == "image") {
+						this.initInsertImage(toolbar);
 					}
 				}
 			}
@@ -144,6 +204,91 @@
 			this.el.before(toolbar);
 
 			return toolbar;
+		},
+
+		initHtml: function(toolbar) {
+			var changeViewSelector = "a[data-wysihtml5-action='change_view']";
+			toolbar.find(changeViewSelector).click(function(e) {
+				toolbar.find('a.btn').not(changeViewSelector).toggleClass('disabled');
+			});
+		},
+
+		initInsertImage: function(toolbar) {
+			var self = this;
+			var insertImageModal = toolbar.find('.bootstrap-wysihtml5-insert-image-modal');
+			var urlInput = insertImageModal.find('.bootstrap-wysihtml5-insert-image-url');
+			var insertButton = insertImageModal.find('a.btn-primary');
+
+			var insertImage = function() { 
+				var url = urlInput.val();
+				urlInput.val('');
+				self.editor.composer.commands.exec("createLink", { 
+					href: url, 
+					target: "_blank", 
+					rel: "nofollow" 
+				});
+			};
+			
+			urlInput.keypress(function(e) {
+				if(e.which == 13) {
+					insertImage();
+					insertImageModal.modal('hide');
+				}
+			});
+
+			insertButton.click(insertImage);
+
+			insertImageModal.on('shown', function() {
+				urlInput.focus();
+			});
+
+			insertImageModal.on('hide', function() { 
+				self.editor.currentView.element.focus();
+			});
+
+			toolbar.find('a[data-wysihtml5-command=insertImage]').click(function() {
+				insertImageModal.modal('show');
+			});
+		},
+
+		initInsertLink: function(toolbar) {
+			var self = this;
+			var insertLinkModal = toolbar.find('.bootstrap-wysihtml5-insert-link-modal');
+			var urlInput = insertLinkModal.find('.bootstrap-wysihtml5-insert-link-url');
+			var insertButton = insertLinkModal.find('a.btn-primary');
+			var initialValue = urlInput.val();
+
+			var insertLink = function() { 
+				var url = urlInput.val();
+				urlInput.val(initialValue);
+				self.editor.composer.commands.exec("createLink", { 
+					href: url, 
+					target: "_blank", 
+					rel: "nofollow" 
+				});
+			};
+			var pressedEnter = false;
+
+			urlInput.keypress(function(e) {
+				if(e.which == 13) {
+					insertLink();
+					insertLinkModal.modal('hide');
+				}
+			});
+
+			insertButton.click(insertLink);
+
+			insertLinkModal.on('shown', function() {
+				urlInput.focus();
+			});
+
+			insertLinkModal.on('hide', function() { 
+				self.editor.currentView.element.focus();
+			});
+
+			toolbar.find('a[data-wysihtml5-command=createLink]').click(function() {
+				insertLinkModal.modal('show');
+			});
 		}
 	};
 
@@ -156,4 +301,4 @@
 
   	$.fn.wysihtml5.Constructor = Wysihtml5;
 
-}(window.jQuery, window.wysihtml5);
+}(window.jQuery, window.wysihtml5);