New UI changes(tags, categories, authorisations, module index…)

To run:
  - ruby lib/remove_old_tags.rb DB_NAME
  - rake new_ui:migrate_tags
  - rake new_ui:migrate_categories['APP_KEY,''MODEL_NAME'] (check new_ui.rake for more details)

app/assets/javascripts/ckeditor/config.js.coffee.erb

@@ -0,0 +1,25 @@
+CKEDITOR.editorConfig = (config) ->
+  # config.language = "zh"
+  # config.uiColor = "#AADC6E"
+  config.extraPlugins = 'wordcount,filebrowser'
+  # config.customFilebrowserImageBrowseLinkUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+
+  # config.filebrowserUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserBrowseUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  config.filebrowserImageBrowseUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserFlashBrowseUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserImageUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserFlashUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  # config.filebrowserImageBrowseLinkUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+  config.filebrowserWindowHeight = 480
+  config.filebrowserWindowWidth = 640
+  config.filebrowserWindowFeatures = 'resizable=no,scrollbars=no'
+
+  config.wordcount = 
+    # Whether or not you want to show the Word Count
+    showWordCount: true
+    # Whether or not you want to show the Char Count
+    showCharCount: true
+
+  true

app/assets/javascripts/ckeditor/plugins/filebrowser/plugin.js

@@ -0,0 +1,497 @@
+/**
+ * @license Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.html or http://ckeditor.com/license
+ */
+
+/**
+ * @fileOverview The "filebrowser" plugin that adds support for file uploads and
+ *               browsing.
+ *
+ * When a file is uploaded or selected inside the file browser, its URL is
+ * inserted automatically into a field defined in the <code>filebrowser</code>
+ * attribute. In order to specify a field that should be updated, pass the tab ID and
+ * the element ID, separated with a colon.<br /><br />
+ *
+ * <strong>Example 1: (Browse)</strong>
+ *
+ * <pre>
+ * {
+ * 	type : 'button',
+ * 	id : 'browse',
+ * 	filebrowser : 'tabId:elementId',
+ * 	label : editor.lang.common.browseServer
+ * }
+ * </pre>
+ *
+ * If you set the <code>filebrowser</code> attribute for an element other than
+ * the <code>fileButton</code>, the <code>Browse</code> action will be triggered.<br /><br />
+ *
+ * <strong>Example 2: (Quick Upload)</strong>
+ *
+ * <pre>
+ * {
+ * 	type : 'fileButton',
+ * 	id : 'uploadButton',
+ * 	filebrowser : 'tabId:elementId',
+ * 	label : editor.lang.common.uploadSubmit,
+ * 	'for' : [ 'upload', 'upload' ]
+ * }
+ * </pre>
+ *
+ * If you set the <code>filebrowser</code> attribute for a <code>fileButton</code>
+ * element, the <code>QuickUpload</code> action will be executed.<br /><br />
+ *
+ * The filebrowser plugin also supports more advanced configuration performed through
+ * a JavaScript object.
+ *
+ * The following settings are supported:
+ *
+ * <ul>
+ * <li><code>action</code> &ndash; <code>Browse</code> or <code>QuickUpload</code>.</li>
+ * <li><code>target</code> &ndash; the field to update in the <code><em>tabId:elementId</em></code> format.</li>
+ * <li><code>params</code> &ndash; additional arguments to be passed to the server connector (optional).</li>
+ * <li><code>onSelect</code> &ndash; a function to execute when the file is selected/uploaded (optional).</li>
+ * <li><code>url</code> &ndash; the URL to be called (optional).</li>
+ * </ul>
+ *
+ * <strong>Example 3: (Quick Upload)</strong>
+ *
+ * <pre>
+ * {
+ * 	type : 'fileButton',
+ * 	label : editor.lang.common.uploadSubmit,
+ * 	id : 'buttonId',
+ * 	filebrowser :
+ * 	{
+ * 		action : 'QuickUpload', // required
+ * 		target : 'tab1:elementId', // required
+ * 		params : // optional
+ * 		{
+ * 			type : 'Files',
+ * 			currentFolder : '/folder/'
+ * 		},
+ * 		onSelect : function( fileUrl, errorMessage ) // optional
+ * 		{
+ * 			// Do not call the built-in selectFuntion.
+ * 			// return false;
+ * 		}
+ * 	},
+ * 	'for' : [ 'tab1', 'myFile' ]
+ * }
+ * </pre>
+ *
+ * Suppose you have a file element with an ID of <code>myFile</code>, a text
+ * field with an ID of <code>elementId</code> and a <code>fileButton</code>.
+ * If the <code>filebowser.url</code> attribute is not specified explicitly,
+ * the form action will be set to <code>filebrowser[<em>DialogWindowName</em>]UploadUrl</code>
+ * or, if not specified, to <code>filebrowserUploadUrl</code>. Additional parameters
+ * from the <code>params</code> object will be added to the query string. It is
+ * possible to create your own <code>uploadHandler</code> and cancel the built-in
+ * <code>updateTargetElement</code> command.<br /><br />
+ *
+ * <strong>Example 4: (Browse)</strong>
+ *
+ * <pre>
+ * {
+ * 	type : 'button',
+ * 	id : 'buttonId',
+ * 	label : editor.lang.common.browseServer,
+ * 	filebrowser :
+ * 	{
+ * 		action : 'Browse',
+ * 		url : '/ckfinder/ckfinder.html&amp;type=Images',
+ * 		target : 'tab1:elementId'
+ * 	}
+ * }
+ * </pre>
+ *
+ * In this example, when the button is pressed, the file browser will be opened in a
+ * popup window. If you do not specify the <code>filebrowser.url</code> attribute,
+ * <code>filebrowser[<em>DialogName</em>]BrowseUrl</code> or
+ * <code>filebrowserBrowseUrl</code> will be used. After selecting a file in the file
+ * browser, an element with an ID of <code>elementId</code> will be updated. Just
+ * like in the third example, a custom <code>onSelect</code> function may be defined.
+ */
+
+(function() {
+	// Adds (additional) arguments to given url.
+	//
+	// @param {String}
+	//            url The url.
+	// @param {Object}
+	//            params Additional parameters.
+	function addQueryString( url, params ) {
+		var queryString = [];
+
+		if ( !params )
+			return url;
+		else {
+			for ( var i in params )
+				queryString.push( i + "=" + encodeURIComponent( params[ i ] ) );
+		}
+
+		return url + ( ( url.indexOf( "?" ) != -1 ) ? "&" : "?" ) + queryString.join( "&" );
+	}
+
+	// Make a string's first character uppercase.
+	//
+	// @param {String}
+	//            str String.
+	function ucFirst( str ) {
+		str += '';
+		var f = str.charAt( 0 ).toUpperCase();
+		return f + str.substr( 1 );
+	}
+
+	// The onlick function assigned to the 'Browse Server' button. Opens the
+	// file browser and updates target field when file is selected.
+	//
+	// @param {CKEDITOR.event}
+	//            evt The event object.
+	function browseServer( evt ) {
+		var dialog = this.getDialog();
+		var editor = dialog.getParentEditor();
+
+		editor._.filebrowserSe = this;
+
+		var width = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowWidth' ] || editor.config.filebrowserWindowWidth || '80%';
+		var height = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowHeight' ] || editor.config.filebrowserWindowHeight || '70%';
+
+		var params = this.filebrowser.params || {};
+		params.CKEditor = editor.name;
+		params.CKEditorFuncNum = editor._.filebrowserFn;
+		if ( !params.langCode )
+			params.langCode = editor.langCode;
+
+		var url = addQueryString( this.filebrowser.url, params );
+		// TODO: V4: Remove backward compatibility (#8163).
+		editor.popup( url, width, height, editor.config.filebrowserWindowFeatures || editor.config.fileBrowserWindowFeatures );
+	}
+
+	// The onlick function assigned to the 'Upload' button. Makes the final
+	// decision whether form is really submitted and updates target field when
+	// file is uploaded.
+	//
+	// @param {CKEDITOR.event}
+	//            evt The event object.
+	function uploadFile( evt ) {
+		var dialog = this.getDialog();
+		var editor = dialog.getParentEditor();
+
+		editor._.filebrowserSe = this;
+
+		// If user didn't select the file, stop the upload.
+		if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement().$.value )
+			return false;
+
+		if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getAction() )
+			return false;
+
+		return true;
+	}
+
+	// Setups the file element.
+	//
+	// @param {CKEDITOR.ui.dialog.file}
+	//            fileInput The file element used during file upload.
+	// @param {Object}
+	//            filebrowser Object containing filebrowser settings assigned to
+	//            the fileButton associated with this file element.
+	function setupFileElement( editor, fileInput, filebrowser ) {
+		var params = filebrowser.params || {};
+		params.CKEditor = editor.name;
+		params.CKEditorFuncNum = editor._.filebrowserFn;
+		if ( !params.langCode )
+			params.langCode = editor.langCode;
+
+		fileInput.action = addQueryString( filebrowser.url, params );
+		fileInput.filebrowser = filebrowser;
+	}
+
+	// Traverse through the content definition and attach filebrowser to
+	// elements with 'filebrowser' attribute.
+	//
+	// @param String
+	//            dialogName Dialog name.
+	// @param {CKEDITOR.dialog.definitionObject}
+	//            definition Dialog definition.
+	// @param {Array}
+	//            elements Array of {@link CKEDITOR.dialog.definition.content}
+	//            objects.
+	function attachFileBrowser( editor, dialogName, definition, elements ) {
+		if ( !elements || !elements.length )
+			return;
+
+		var element, fileInput;
+
+		for ( var i = elements.length; i--; ) {
+			element = elements[ i ];
+
+			if ( element.type == 'hbox' || element.type == 'vbox' || element.type == 'fieldset' )
+				attachFileBrowser( editor, dialogName, definition, element.children );
+
+			if ( !element.filebrowser )
+				continue;
+
+			if ( typeof element.filebrowser == 'string' ) {
+				var fb = {
+					action: ( element.type == 'fileButton' ) ? 'QuickUpload' : 'Browse',
+					target: element.filebrowser
+				};
+				element.filebrowser = fb;
+			}
+
+			if ( element.filebrowser.action == 'Browse' ) {
+				var url = element.filebrowser.url;
+				if ( url === undefined ) {
+					url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];
+					if ( url === undefined )
+						url = editor.config.filebrowserBrowseUrl;
+				}
+
+				if ( url ) {
+					element.onClick = browseServer;
+					element.filebrowser.url = url;
+					element.hidden = false;
+				}
+			} else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] ) {
+				url = element.filebrowser.url;
+				if ( url === undefined ) {
+					url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];
+					if ( url === undefined )
+						url = editor.config.filebrowserUploadUrl;
+				}
+
+				if ( url ) {
+					var onClick = element.onClick;
+					element.onClick = function( evt ) {
+						// "element" here means the definition object, so we need to find the correct
+						// button to scope the event call
+						var sender = evt.sender;
+						if ( onClick && onClick.call( sender, evt ) === false )
+							return false;
+
+						return uploadFile.call( sender, evt );
+					};
+
+					element.filebrowser.url = url;
+					element.hidden = false;
+					setupFileElement( editor, definition.getContents( element[ 'for' ][ 0 ] ).get( element[ 'for' ][ 1 ] ), element.filebrowser );
+				}
+			}
+		}
+	}
+
+	// Updates the target element with the url of uploaded/selected file.
+	//
+	// @param {String}
+	//            url The url of a file.
+	function updateTargetElement( url, sourceElement ) {
+		var dialog = sourceElement.getDialog();
+		var targetElement = sourceElement.filebrowser.target || null;
+
+		// If there is a reference to targetElement, update it.
+		if ( targetElement ) {
+			var target = targetElement.split( ':' );
+			var element = dialog.getContentElement( target[ 0 ], target[ 1 ] );
+			if ( element ) {
+				element.setValue( url );
+				dialog.selectPage( target[ 0 ] );
+			}
+		}
+	}
+
+	// Returns true if filebrowser is configured in one of the elements.
+	//
+	// @param {CKEDITOR.dialog.definitionObject}
+	//            definition Dialog definition.
+	// @param String
+	//            tabId The tab id where element(s) can be found.
+	// @param String
+	//            elementId The element id (or ids, separated with a semicolon) to check.
+	function isConfigured( definition, tabId, elementId ) {
+		if ( elementId.indexOf( ";" ) !== -1 ) {
+			var ids = elementId.split( ";" );
+			for ( var i = 0; i < ids.length; i++ ) {
+				if ( isConfigured( definition, tabId, ids[ i ] ) )
+					return true;
+			}
+			return false;
+		}
+
+		var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;
+		return ( elementFileBrowser && elementFileBrowser.url );
+	}
+
+	function setUrl( fileUrl, data ) {
+		var dialog = this._.filebrowserSe.getDialog(),
+			targetInput = this._.filebrowserSe[ 'for' ],
+			onSelect = this._.filebrowserSe.filebrowser.onSelect;
+
+		if ( targetInput )
+			dialog.getContentElement( targetInput[ 0 ], targetInput[ 1 ] ).reset();
+
+		if ( typeof data == 'function' && data.call( this._.filebrowserSe ) === false )
+			return;
+
+		if ( onSelect && onSelect.call( this._.filebrowserSe, fileUrl, data ) === false )
+			return;
+
+		// The "data" argument may be used to pass the error message to the editor.
+		if ( typeof data == 'string' && data )
+			alert( data );
+
+		if ( fileUrl )
+			updateTargetElement( fileUrl, this._.filebrowserSe );
+	}
+
+	CKEDITOR.plugins.add( 'filebrowser', {
+		requires: 'popup',
+		init: function( editor, pluginPath ) {
+			editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );
+			editor.on( 'destroy', function() {
+				CKEDITOR.tools.removeFunction( this._.filebrowserFn );
+			});
+		}
+	});
+
+	CKEDITOR.on( 'dialogDefinition', function( evt ) {
+		var definition = evt.data.definition,
+			element;
+		// Associate filebrowser to elements with 'filebrowser' attribute.
+		for ( var i = 0; i < definition.contents.length; ++i ) {
+			if ( ( element = definition.contents[ i ] ) ) {
+				attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );
+				if ( element.hidden && element.filebrowser ) {
+					element.hidden = !isConfigured( definition, element[ 'id' ], element.filebrowser );
+				}
+			}
+		}
+	});
+
+})();
+
+/**
+ * The location of an external file browser that should be launched when the **Browse Server**
+ * button is pressed. If configured, the **Browse Server** button will appear in the
+ * **Link**, **Image**, and **Flash** dialog windows.
+ *
+ * See the [File Browser/Uploader](http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader\)) documentation.
+ *
+ *		config.filebrowserBrowseUrl = '/browser/browse.php';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of the script that handles file uploads.
+ * If set, the **Upload** tab will appear in the **Link**, **Image**,
+ * and **Flash** dialog windows.
+ *
+ * See the [File Browser/Uploader](http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader\)) documentation.
+ *
+ *		config.filebrowserUploadUrl = '/uploader/upload.php';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of an external file browser that should be launched when the **Browse Server**
+ * button is pressed in the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ *		config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserImageBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of an external file browser that should be launched when the **Browse Server**
+ * button is pressed in the **Flash** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ *		config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserFlashBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of the script that handles file uploads in the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
+ *
+ *		config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserImageUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of the script that handles file uploads in the **Flash** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
+ *
+ *		config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';
+ *
+ * @since 3.0
+ * @cfg {String} filebrowserFlashUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The location of an external file browser that should be launched when the **Browse Server**
+ * button is pressed in the **Link** tab of the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ *		config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';
+ *
+ * @since 3.2
+ * @cfg {String} [filebrowserImageBrowseLinkUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The features to use in the file browser popup window.
+ *
+ *		config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';
+ *
+ * @since 3.4.1
+ * @cfg {String} [filebrowserWindowFeatures='location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes']
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The width of the file browser popup window. It can be a number denoting a value in
+ * pixels or a percent string.
+ *
+ *		config.filebrowserWindowWidth = 750;
+ *
+ *		config.filebrowserWindowWidth = '50%';
+ *
+ * @cfg {Number/String} [filebrowserWindowWidth='80%']
+ * @member CKEDITOR.config
+ */
+
+/**
+ * The height of the file browser popup window. It can be a number denoting a value in
+ * pixels or a percent string.
+ *
+ *		config.filebrowserWindowHeight = 580;
+ *
+ *		config.filebrowserWindowHeight = '50%';
+ *
+ * @cfg {Number/String} [filebrowserWindowHeight='70%']
+ * @member CKEDITOR.config
+ */

app/assets/javascripts/ckeditor/plugins/wordcount/css/wordcount.css

@@ -0,0 +1,3 @@
+.cke_wordcount {display:block;float:right;margin-top:-2px;margin-right:3px;color:black;}
+
+.cke_wordcountLimitReached span {color:red! important}

app/assets/javascripts/ckeditor/plugins/wordcount/lang/de.js

@@ -0,0 +1,10 @@
+/*
+Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.html or http://ckeditor.com/license
+*/
+CKEDITOR.plugins.setLang('wordcount', 'de', {
+    WordCount: 'Wörter:',
+    CharCount: 'Zeichen:',
+    limit: 'Limit:',
+    title: 'Statistik'
+});

app/assets/javascripts/ckeditor/plugins/wordcount/lang/en.js

@@ -0,0 +1,10 @@
+/*
+Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.html or http://ckeditor.com/license
+*/
+CKEDITOR.plugins.setLang('wordcount', 'en', {
+    WordCount: 'Words:',
+    CharCount: 'Characters:',
+    limit: 'Limit:',
+    title: 'Statistics'
+});

app/assets/javascripts/ckeditor/plugins/wordcount/lang/fr.js

@@ -0,0 +1,8 @@
+// French Translation by Nicolas M.
+
+CKEDITOR.plugins.setLang('wordcount', 'fr', {
+    WordCount: 'Mots:',
+    CharCount: 'Caractères:',
+    limit: 'Limite:',
+    title: 'Statistiques'
+});

app/assets/javascripts/ckeditor/plugins/wordcount/lang/pl.js

@@ -0,0 +1,10 @@
+/*
+Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.html or http://ckeditor.com/license
+*/
+CKEDITOR.plugins.setLang('wordcount', 'pl', {
+    WordCount: 'Słów:',
+    CharCount: 'Znaków:',
+    limit: 'Limit:',
+    title: 'Statystyka'
+});

app/assets/javascripts/ckeditor/plugins/wordcount/plugin.js

@@ -0,0 +1,172 @@
+/**
+ * @license Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.html or http://ckeditor.com/license
+ */
+ 
+CKEDITOR.plugins.add('wordcount', {
+    lang: ['de', 'en', 'fr', 'pl'],
+    init: function (editor) {
+        
+        var defaultFormat = '<span class="cke_path_item">';
+        
+        var intervalId;
+        var lastWordCount = 0;
+        var lastCharCount = 0;
+        var limitReachedNotified = false;
+        var limitRestoredNotified = false;
+        
+        // Default Config
+        var defaultConfig = {
+            showWordCount: true,
+            showCharCount: false,
+            charLimit: 'unlimited',
+            wordLimit: 'unlimited'
+        };
+        
+        // Get Config & Lang
+        var config = CKEDITOR.tools.extend(defaultConfig, editor.config.wordcount || {}, true);
+        
+        if (config.showCharCount) {
+            defaultFormat += editor.lang.wordcount.CharCount + '&nbsp;%charCount%';
+
+
+            if (config.charLimit != 'unlimited') {
+                defaultFormat += '&nbsp;(' + editor.lang.wordcount.limit + '&nbsp;' + config.charLimit + ')';
+            }
+        }
+
+        if (config.showCharCount && config.showWordCount) {
+            defaultFormat += ',&nbsp;';
+        }
+
+        if (config.showWordCount) {
+            defaultFormat += editor.lang.wordcount.WordCount + ' %wordCount%';
+            
+            if (config.wordLimit != 'unlimited') {
+                defaultFormat += '&nbsp;(' + editor.lang.wordcount.limit + '&nbsp;' + config.wordLimit + ')';
+            }
+        }
+        
+        defaultFormat += '</span>';
+        
+        var format = defaultFormat;
+
+        CKEDITOR.document.appendStyleSheet(this.path + 'css/wordcount.css');
+
+        function counterId(editor) {
+            return 'cke_wordcount_' + editor.name;
+        }
+
+        function counterElement(editor) {
+            return document.getElementById(counterId(editor));
+        }
+
+        function strip(html) {
+            var tmp = document.createElement("div");
+            tmp.innerHTML = html;
+
+            if (tmp.textContent == '' && typeof tmp.innerText == 'undefined') {
+               return '0';
+            }
+            return tmp.textContent || tmp.innerText;
+        }
+        
+        function updateCounter(editor) {
+            
+            var wordCount = 0;
+            var charCount = 0;
+
+            if (editor.getData()) {
+                var text = editor.getData().replace(/(\r\n|\n|\r)/gm, " ").replace(/(&nbsp;)/g, " ");
+				
+                if (config.showWordCount) {
+					wordCount = strip(text).trim().split(/\s+/).length;
+                }
+
+                charCount = strip(text).trim().length;
+            }
+            var html = format.replace('%wordCount%', wordCount).replace('%charCount%', charCount);
+            
+            counterElement(editor).innerHTML = html;
+
+            if (charCount == lastCharCount) {
+                return true;
+            } else {
+                lastWordCount = wordCount;
+                lastCharCount = charCount;
+            }
+            
+            // Check for word limit
+            if (config.showWordCount && wordCount > config.wordLimit) {
+                limitReached(editor, limitReachedNotified);
+            } else if (!limitRestoredNotified && wordCount < config.wordLimit) {
+                limitRestored(editor);
+            }
+            
+            // Check for char limit
+            if (config.showCharCount && charCount > config.charLimit) {
+                limitReached(editor, limitReachedNotified);
+            } else if (!limitRestoredNotified && charCount < config.charLimit) {
+                limitRestored(editor);
+               
+            }
+            
+            return true;
+        }
+
+        function limitReached(editor, notify) {
+            limitReachedNotified = true;
+            limitRestoredNotified = false;
+            
+            editor.execCommand('undo');
+            if (!notify) {
+                counterElement(editor).className += " cke_wordcountLimitReached";
+
+                editor.fire('limitReached', {}, editor);
+            }
+            // lock editor
+            editor.config.Locked = 1;
+            editor.fire("change");
+        }
+
+        function limitRestored(editor) {
+            limitRestoredNotified = true;
+            limitReachedNotified = false;
+            editor.config.Locked = 0;
+            
+            counterElement(editor).className = "cke_wordcount";
+        }
+
+        editor.on('uiSpace', function(event) {
+            if (event.data.space == 'bottom') {
+                event.data.html += '<div id="' + counterId(event.editor) + '" class="cke_wordcount" style=""' + ' title="' + editor.lang.wordcount.title + '"' + '>&nbsp;</div>';
+            }
+        }, editor, null, 100);
+       editor.on('dataReady', function(event) {
+            var count = event.editor.getData().length;
+            if (count > config.wordLimit) {
+                limitReached(editor);
+            }
+            updateCounter(event.editor);
+        }, editor, null, 100);
+		editor.on('key', function (event) {
+		    updateCounter(event.editor);
+		}, editor, null, 100);
+		editor.on('afterPaste', function (event) {
+		    updateCounter(event.editor);
+		}, editor, null, 100);
+       /* editor.on('change', function (event) {
+            updateCounter(event.editor);
+        }, editor, null, 100);*/
+        editor.on('focus', function(event) {
+            editorHasFocus = true;
+            intervalId = window.setInterval(function(editor) {
+                updateCounter(editor);
+            }, 100, event.editor);
+        }, editor, null, 100);
+        editor.on('blur', function() {
+            editorHasFocus = false;
+            if (intervalId) clearInterval(intervalId);
+        }, editor, null, 100);
+    }
+});

app/assets/javascripts/ckeditor/plugins/youtube/lang/en.js

@@ -0,0 +1,20 @@
+CKEDITOR.plugins.setLang('youtube', 'en', {
+	button : 'Embed Youtube Video',
+	title : 'Embed Youtube Video',
+	txtEmbed : 'Paste Embed Code Here',
+	txtUrl : 'Paste Youtube Video URL',
+	txtWidth : 'Width',
+	txtHeight : 'Height',
+	chkRelated : 'Show suggested videos at the video\'s end',
+	chkSecure : 'Use HTTPS',
+	chkPrivacy : 'Enable privacy-enhanced mode',
+	chkOlderCode : 'Use old embed code',
+	noCode : 'You must input an embed code or URL',
+	invalidEmbed : 'The embed code you\'ve entered doesn\'t appear to be valid',
+	invalidUrl : 'The URL you\'ve entered doesn\'t appear to be valid',
+	or : 'or',
+	noWidth : 'You must inform the width',
+	invalidWidth : 'Inform a valid width',
+	noHeight : 'You must inform the height',
+	invalidHeight : 'Inform a valid height'
+});

app/assets/javascripts/ckeditor/plugins/youtube/lang/pt.js

@@ -0,0 +1,20 @@
+CKEDITOR.plugins.setLang('youtube', 'pt', {
+	button : 'Inserir Vídeo do Youtube',
+	title : 'Inserir Vídeo do Youtube',
+	txtEmbed : 'Cole aqui o código embed de um vídeo do Youtube',
+	txtUrl : 'Cole aqui uma URL de um vídeo do Youtube',
+	txtWidth : 'Largura',
+	txtHeight : 'Altura',
+	chkRelated : 'Mostrar vídeos sugeridos ao final do vídeo',
+	chkSecure : 'Usar HTTPS',
+	chkPrivacy : 'Ativar o modo de privacidade aprimorada',
+	chkOlderCode : 'Usar código de incorporação antigo',
+	noCode : 'Você precisa informar um código embed ou uma URL',
+	invalidEmbed : 'O código informado não parece ser válido',
+	invalidUrl : 'A URL informada não parece ser válida',
+	or : 'ou',
+	noWidth : 'Você deve informar a largura do vídeo',
+	invalidWidth : 'Informe uma largura válida',
+	noHeight : 'Você deve informar a altura do vídeo',
+	invalidHeight : 'Informe uma altura válida'
+});

app/assets/javascripts/ckeditor/plugins/youtube/plugin.js

@@ -0,0 +1,284 @@
+/*
+* Youtube Embed Plugin
+*
+* @author Jonnas Fonini <contato@fonini.net>
+* @version 0.5
+*/
+( function() {
+	CKEDITOR.plugins.add( 'youtube',
+	{
+		lang: [ 'en', 'pt' ],
+		init: function( editor )
+		{
+			editor.addCommand( 'youtube', new CKEDITOR.dialogCommand( 'youtube' ) );
+
+			editor.ui.addButton( 'youtube',
+			{
+				label : editor.lang.youtube.button,
+				toolbar : 'insert',
+				command : 'youtube',
+				icon : this.path + 'images/icon.png'
+			});
+
+			CKEDITOR.dialog.add( 'youtube', function ( instance )
+			{
+				return {
+					title : editor.lang.youtube.title,
+					minWidth : 500,
+					minHeight : 200,
+					contents :
+						[{
+							id : 'youtubePlugin',
+							expand : true,
+							elements :
+								[{
+									id : 'txtEmbed',
+									type : 'textarea',
+									label : editor.lang.youtube.txtEmbed,
+									autofocus : 'autofocus',
+									onChange : function ( api )
+									{
+										if ( this.getValue().length > 0 )
+										{
+											this.getDialog().getContentElement( 'youtubePlugin', 'txtUrl' ).disable();
+										}
+										else {
+											this.getDialog().getContentElement( 'youtubePlugin', 'txtUrl' ).enable();
+										}
+									},
+									validate : function ()
+									{
+										if ( this.isEnabled() )
+										{
+											if ( !this.getValue() )
+											{
+												alert( editor.lang.youtube.noCode );
+												return false;
+											}
+											else
+											if ( this.getValue().length === 0 || this.getValue().indexOf( 'http://' ) === -1 )
+											{
+												alert( editor.lang.youtube.invalidEmbed );
+												return false;
+											}
+										}
+									}
+								},
+								{
+									type : 'html',
+									html : editor.lang.youtube.or + '<hr>'
+								},
+								{
+									type : 'hbox',
+									widths : [ '70%', '15%', '15%' ],
+									children :
+									[
+										{
+											id : 'txtUrl',
+											type : 'text',
+											label : editor.lang.youtube.txtUrl,
+											onChange : function ( api )
+											{
+												if ( this.getValue().length > 0 )
+												{
+													this.getDialog().getContentElement( 'youtubePlugin', 'txtEmbed' ).disable();
+												}
+												else {
+													this.getDialog().getContentElement( 'youtubePlugin', 'txtEmbed' ).enable();
+												}
+											},
+											validate : function ()
+											{
+												if ( this.isEnabled() )
+												{
+													if ( !this.getValue() )
+													{
+														alert( editor.lang.youtube.noCode );
+														return false;
+													}
+													else
+													if ( this.getValue().length === 0 || ytVidId(this.getValue()) === false )
+													{
+														alert( editor.lang.youtube.invalidUrl );
+														return false;
+													}
+												}
+											}
+										},
+										{
+											type : 'text',
+											id : 'txtWidth',
+											width : '60px',
+											label : editor.lang.youtube.txtWidth,
+											'default' : '640',
+											validate : function ()
+											{
+												if ( this.getValue() )
+												{
+													var width = parseInt ( this.getValue() ) || 0;
+
+													if ( width === 0 )
+													{
+														alert( editor.lang.youtube.invalidWidth );
+														return false;	
+													}
+												}
+												else {
+													alert( editor.lang.youtube.noWidth );
+													return false;
+												}
+											}
+										},
+										{
+											type : 'text',
+											id : 'txtHeight',
+											width : '60px',
+											label : editor.lang.youtube.txtHeight,
+											'default' : '360',
+											validate : function ()
+											{
+												if ( this.getValue() )
+												{
+													var height = parseInt ( this.getValue() ) || 0;
+
+													if ( height === 0 )
+													{
+														alert( editor.lang.youtube.invalidHeight );
+														return false;	
+													}
+												}
+												else {
+													alert( editor.lang.youtube.noHeight );
+													return false;
+												}
+											}
+										}
+									]
+								},
+								{
+									type : 'hbox',
+									widths : [ '55%', '45%' ],
+									children :
+									[
+										{
+											id : 'chkRelated',
+											type : 'checkbox',
+											'default' : 'checked',
+											label : editor.lang.youtube.chkRelated
+										},
+										{
+											id : 'chkSecure',
+											type : 'checkbox',
+											label : editor.lang.youtube.chkSecure
+										}
+									]
+								},
+								{
+									type : 'hbox',
+									widths : [ '55%', '45%' ],
+									children :
+									[
+										{
+											id : 'chkPrivacy',
+											type : 'checkbox',
+											label : editor.lang.youtube.chkPrivacy
+										},
+										{
+											id : 'chkOlderCode',
+											type : 'checkbox',
+											label : editor.lang.youtube.chkOlderCode
+										}
+									]
+								}
+							]
+						}
+					],
+					onOk: function()
+					{
+						var content = '';
+
+						if ( this.getContentElement( 'youtubePlugin', 'txtEmbed' ).isEnabled() )
+						{
+							content = this.getValueOf( 'youtubePlugin', 'txtEmbed' );
+						}
+						else {
+							var url = this.getValueOf( 'youtubePlugin', 'txtUrl' );
+							var width = this.getValueOf( 'youtubePlugin', 'txtWidth' );
+							var height = this.getValueOf( 'youtubePlugin', 'txtHeight' );
+							var related = true;
+
+							var video = url.match(/(v=|\/)([\w-]+)(&.+)?$/);
+
+							if ( this.getContentElement( 'youtubePlugin', 'chkSecure' ).getValue() === true )
+							{
+								url = 'https://';
+							}
+							else {
+								url = 'http://';
+							}
+
+							if ( this.getContentElement( 'youtubePlugin', 'chkPrivacy' ).getValue() === true )
+							{
+								url += 'www.youtube-nocookie.com/';
+							}
+							else {
+								url += 'www.youtube.com/';
+							}
+
+							url += 'embed/' + video[2];
+
+							if ( this.getContentElement( 'youtubePlugin', 'chkRelated' ).getValue() === false )
+							{
+								url += '?rel=0';
+								related = false;
+
+							}
+
+							if ( this.getContentElement( 'youtubePlugin', 'chkOlderCode' ).getValue() === true )
+							{
+								url = url.replace('embed/', 'v/');
+								url = url.replace(/&/g, '&amp;');
+
+								if (related === true)
+								{
+									url += '?';								
+								}
+
+								url += 'hl=pt_BR&amp;version=3';
+
+								content = '<object width="' + width + '" height="' + height + '">';
+								content += '<param name="movie" value="' + url + '"></param>';
+								content += '<param name="allowFullScreen" value="true"></param>';
+								content += '<param name="allowscriptaccess" value="always"></param>';
+								content += '<embed src="' + url + '" type="application/x-shockwave-flash" ';
+								content += 'width="' + width + '" height="' + height + '" allowscriptaccess="always" ';
+								content += 'allowfullscreen="true"></embed>';
+								content += '</object>';
+							}
+							else {
+								content = '<iframe width="' + width + '" height="' + height + '" src="' + url + '" ';
+								content += 'frameborder="0" allowfullscreen></iframe>';	
+							}
+						}
+
+						var instance = this.getParentEditor();
+						instance.insertHtml( content );
+					}
+				};
+			});
+		}
+	});
+})();
+
+
+/**
+ * JavaScript function to match (and return) the video Id 
+ * of any valid Youtube Url, given as input string.
+ * @author: Stephan Schmitz <eyecatchup@gmail.com>
+ * @url: http://stackoverflow.com/a/10315969/624466
+ */
+function ytVidId( url )
+{
+	var p = /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/;
+	return ( url.match( p ) ) ? RegExp.$1 : false;
+}