annex-cms 0.4.0 → 0.5.0

data/app/assets/javascripts/annex/jquery.redactor.table.js

@@ -1,169 +1,304 @@
-if (!RedactorPlugins) var RedactorPlugins = {};
-
-RedactorPlugins.table = function()
+(function($)
 {
-	return {
-		getTemplate: function()
-		{
-			return String()
-			+ '<section id="redactor-modal-table-insert">'
-				+ '<label>' + this.lang.get('rows') + '</label>'
-				+ '<input type="text" size="5" value="2" id="redactor-table-rows" />'
-				+ '<label>' + this.lang.get('columns') + '</label>'
-				+ '<input type="text" size="5" value="3" id="redactor-table-columns" />'
-			+ '</section>';
-		},
-		init: function()
-		{
-
-			var dropdown = {};
-
-			dropdown.insert_table = { title: this.lang.get('insert_table'), func: this.table.show };
-			dropdown.insert_row_above = { title: this.lang.get('insert_row_above'), func: this.table.addRowAbove };
-			dropdown.insert_row_below = { title: this.lang.get('insert_row_below'), func: this.table.addRowBelow };
-			dropdown.insert_column_left = { title: this.lang.get('insert_column_left'), func: this.table.addColumnLeft };
-			dropdown.insert_column_right = { title: this.lang.get('insert_column_right'), func: this.table.addColumnRight };
-			dropdown.add_head = { title: this.lang.get('add_head'), func: this.table.addHead };
-			dropdown.delete_head = { title: this.lang.get('delete_head'), func: this.table.deleteHead };
-			dropdown.delete_column = { title: this.lang.get('delete_column'), func: this.table.deleteColumn };
-			dropdown.delete_row = { title: this.lang.get('delete_row'), func: this.table.deleteRow };
-			dropdown.delete_table = { title: this.lang.get('delete_table'), func: this.table.deleteTable };
-
-			this.observe.addButton('td', 'table');
-			this.observe.addButton('th', 'table');
-
-			var button = this.button.addBefore('link', 'table', this.lang.get('table'));
-			this.button.addDropdown(button, dropdown);
-		},
-		show: function()
-		{
-			this.modal.addTemplate('table', this.table.getTemplate());
-
-			this.modal.load('table', this.lang.get('insert_table'), 300);
-			this.modal.createCancelButton();
-
-			var button = this.modal.createActionButton(this.lang.get('insert'));
-			button.on('click', this.table.insert);
+	$.Redactor.prototype.table = function()
+	{
+		return {
+			getTemplate: function()
+			{
+				return String()
+				+ '<section id="redactor-modal-table-insert">'
+					+ '<label>' + this.lang.get('rows') + '</label>'
+					+ '<input type="text" size="5" value="2" id="redactor-table-rows" />'
+					+ '<label>' + this.lang.get('columns') + '</label>'
+					+ '<input type="text" size="5" value="3" id="redactor-table-columns" />'
+				+ '</section>';
+			},
+			init: function()
+			{
+				var dropdown = {};
+
+				dropdown.insert_table = {
+									title: this.lang.get('insert_table'),
+									func: this.table.show,
+									observe: {
+										element: 'table',
+										in: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.insert_row_above = {
+									title: this.lang.get('insert_row_above'),
+									func: this.table.addRowAbove,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.insert_row_below = {
+									title: this.lang.get('insert_row_below'),
+									func: this.table.addRowBelow,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.insert_column_left = {
+									title: this.lang.get('insert_column_left'),
+									func: this.table.addColumnLeft,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.insert_column_right = {
+									title: this.lang.get('insert_column_right'),
+									func: this.table.addColumnRight,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.add_head = {
+									title: this.lang.get('add_head'),
+									func: this.table.addHead,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.delete_head = {
+									title: this.lang.get('delete_head'),
+									func: this.table.deleteHead,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.delete_column = {
+									title: this.lang.get('delete_column'),
+									func: this.table.deleteColumn,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.delete_row = {
+									title: this.lang.get('delete_row'),
+									func: this.table.deleteRow,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				dropdown.delete_table = {
+									title: this.lang.get('delete_table'),
+									func: this.table.deleteTable,
+									observe: {
+										element: 'table',
+										out: {
+											attr: {
+												'class': 'redactor-dropdown-link-inactive',
+												'aria-disabled': true,
+											}
+										}
+									}
+								};
+
+				this.observe.addButton('td', 'table');
+				this.observe.addButton('th', 'table');
+
+				var button = this.button.addBefore('link', 'table', this.lang.get('table'));
+				this.button.addDropdown(button, dropdown);
+			},
+			show: function()
+			{
+				this.modal.addTemplate('table', this.table.getTemplate());
 
-			this.selection.save();
-			this.modal.show();
+				this.modal.load('table', this.lang.get('insert_table'), 300);
+				this.modal.createCancelButton();
 
-			$('#redactor-table-rows').focus();
+				var button = this.modal.createActionButton(this.lang.get('insert'));
+				button.on('click', this.table.insert);
 
-		},
-		insert: function()
-		{
+				this.selection.save();
+				this.modal.show();
 
-			var rows = $('#redactor-table-rows').val(),
-				columns = $('#redactor-table-columns').val(),
-				$tableBox = $('<div>'),
-				tableId = Math.floor(Math.random() * 99999),
-				$table = $('<table id="table' + tableId + '"><tbody></tbody></table>'),
-				i, $row, z, $column;
+				$('#redactor-table-rows').focus();
 
-			for (i = 0; i < rows; i++)
+			},
+			insert: function()
 			{
-				$row = $('<tr>');
+				this.placeholder.remove();
 
-				for (z = 0; z < columns; z++)
+				var rows = $('#redactor-table-rows').val(),
+					columns = $('#redactor-table-columns').val(),
+					$tableBox = $('<div>'),
+					tableId = Math.floor(Math.random() * 99999),
+					$table = $('<table id="table' + tableId + '"><tbody></tbody></table>'),
+					i, $row, z, $column;
+
+				for (i = 0; i < rows; i++)
 				{
-					$column = $('<td>' + this.opts.invisibleSpace + '</td>');
+					$row = $('<tr>');
 
-					// set the focus to the first td
-					if (i === 0 && z === 0)
+					for (z = 0; z < columns; z++)
 					{
-						$column.append(this.selection.getMarker());
+						$column = $('<td>' + this.opts.invisibleSpace + '</td>');
+
+						// set the focus to the first td
+						if (i === 0 && z === 0)
+						{
+							$column.append(this.selection.getMarker());
+						}
+
+						$($row).append($column);
 					}
 
-					$($row).append($column);
+					$table.append($row);
 				}
 
-				$table.append($row);
-			}
+				$tableBox.append($table);
+				var html = $tableBox.html();
 
-			$tableBox.append($table);
-			var html = $tableBox.html();
+				this.modal.close();
+				this.selection.restore();
 
+				if (this.table.getTable()) return;
 
-			this.modal.close();
-			this.selection.restore();
+				this.buffer.set();
 
-			if (this.table.getTable()) return;
+				var current = this.selection.getBlock() || this.selection.getCurrent();
+				if (current && current.tagName != 'BODY')
+				{
+					if (current.tagName == 'LI') current = $(current).closest('ul, ol');
+					$(current).after(html);
+				}
+				else
+				{
+					this.insert.html(html, false);
+				}
 
-			this.buffer.set();
+				this.selection.restore();
 
-			var current = this.selection.getBlock() || this.selection.getCurrent();
-			if (current && current.tagName != 'BODY')
-			{
-				if (current.tagName == 'LI') current = $(current).closest('ul, ol');
-				$(current).after(html);
-			}
-			else
-			{
-				this.insert.html(html);
-			}
+				var table = this.$editor.find('#table' + tableId);
 
-			this.selection.restore();
+				var p = table.prev("p");
 
-			var table = this.$editor.find('#table' + tableId);
+				if (p.length > 0 && this.utils.isEmpty(p.html()))
+				{
+					p.remove();
+				}
 
-			if (!this.opts.linebreaks && (this.utils.browser('mozilla') || this.utils.browser('msie')))
-			{
-				var $next = table.next();
-				if ($next.length === 0)
+				if (!this.opts.linebreaks && (this.utils.browser('mozilla') || this.utils.browser('msie')))
 				{
-					 table.after(this.opts.emptyHtml);
+					var $next = table.next();
+					if ($next.length === 0)
+					{
+						 table.after(this.opts.emptyHtml);
+					}
 				}
-			}
 
-			this.observe.buttons();
+				this.observe.buttons();
 
-			table.find('span.redactor-selection-marker').remove();
-			table.removeAttr('id');
+				table.find('span.redactor-selection-marker').remove();
+				table.removeAttr('id');
 
-			this.code.sync();
-			this.core.setCallback('insertedTable', table);
-		},
-		getTable: function()
-		{
-			var $table = $(this.selection.getParent()).closest('table');
+				this.code.sync();
+				this.core.setCallback('insertedTable', table);
+			},
+			getTable: function()
+			{
+				var $table = $(this.selection.getParent()).closest('table');
 
-			if (!this.utils.isRedactorParent($table)) return false;
-			if ($table.size() === 0) return false;
+				if (!this.utils.isRedactorParent($table)) return false;
+				if ($table.size() === 0) return false;
 
-			return $table;
-		},
-		restoreAfterDelete: function($table)
-		{
-			this.selection.restore();
-			$table.find('span.redactor-selection-marker').remove();
-			this.code.sync();
-		},
-		deleteTable: function()
-		{
-			var $table = this.table.getTable();
-			if (!$table) return;
+				return $table;
+			},
+			restoreAfterDelete: function($table)
+			{
+				this.selection.restore();
+				$table.find('span.redactor-selection-marker').remove();
+				this.code.sync();
+			},
+			deleteTable: function()
+			{
+				var $table = this.table.getTable();
+				if (!$table) return;
 
-			this.buffer.set();
+				this.buffer.set();
 
 
-			var $next = $table.next();
-			if (!this.opts.linebreaks && $next.length !== 0)
-			{
-				this.caret.setStart($next);
-			}
-			else
-			{
-				this.caret.setAfter($table);
-			}
+				var $next = $table.next();
+				if (!this.opts.linebreaks && $next.length !== 0)
+				{
+					this.caret.setStart($next);
+				}
+				else
+				{
+					this.caret.setAfter($table);
+				}
 
 
-			$table.remove();
+				$table.remove();
 
-			this.code.sync();
-		},
-		deleteRow: function()
-		{
+				this.code.sync();
+			},
+			deleteRow: function()
+			{
 			var $table = this.table.getTable();
 			if (!$table) return;
 
@@ -182,8 +317,8 @@ RedactorPlugins.table = function()
 			$current_tr.remove();
 			this.table.restoreAfterDelete($table);
 		},
-		deleteColumn: function()
-		{
+			deleteColumn: function()
+			{
 			var $table = this.table.getTable();
 			if (!$table) return;
 
@@ -205,126 +340,131 @@ RedactorPlugins.table = function()
 
 			this.table.restoreAfterDelete($table);
 		},
-		addHead: function()
-		{
-			var $table = this.table.getTable();
-			if (!$table) return;
-
-			this.buffer.set();
-
-			if ($table.find('thead').size() !== 0)
+			addHead: function()
 			{
-				this.table.deleteHead();
-				return;
-			}
+				var $table = this.table.getTable();
+				if (!$table) return;
 
-			var tr = $table.find('tr').first().clone();
-			tr.find('td').html(this.opts.invisibleSpace);
-			$thead = $('<thead></thead>').append(tr);
-			$table.prepend($thead);
+				this.buffer.set();
 
-			this.code.sync();
-
-		},
-		deleteHead: function()
-		{
-			var $table = this.table.getTable();
-			if (!$table) return;
-
-			var $thead = $table.find('thead');
-			if ($thead.size() === 0) return;
-
-			this.buffer.set();
+				if ($table.find('thead').size() !== 0)
+				{
+					this.table.deleteHead();
+					return;
+				}
 
-			$thead.remove();
-			this.code.sync();
-		},
-		addRowAbove: function()
-		{
-			this.table.addRow('before');
-		},
-		addRowBelow: function()
-		{
-			this.table.addRow('after');
-		},
-		addColumnLeft: function()
-		{
-			this.table.addColumn('before');
-		},
-		addColumnRight: function()
-		{
-			this.table.addColumn('after');
-		},
-		addRow: function(type)
-		{
-			var $table = this.table.getTable();
-			if (!$table) return;
+				var tr = $table.find('tr').first().clone();
+				tr.find('td').replaceWith($.proxy(function()
+				{
+					return $('<th>').html(this.opts.invisibleSpace);
+				}, this));
 
-			this.buffer.set();
+				$thead = $('<thead></thead>').append(tr);
+				$table.prepend($thead);
 
-			var $current = $(this.selection.getCurrent());
-			var $current_tr = $current.closest('tr');
-			var new_tr = $current_tr.clone();
+				this.code.sync();
 
-			new_tr.find('th').replaceWith(function()
+			},
+			deleteHead: function()
 			{
-				var $td = $('<td>');
-				$td[0].attributes = this.attributes;
+				var $table = this.table.getTable();
+				if (!$table) return;
 
-				return $td.append($(this).contents());
-			});
+				var $thead = $table.find('thead');
+				if ($thead.size() === 0) return;
 
-			new_tr.find('td').html(this.opts.invisibleSpace);
+				this.buffer.set();
 
-			if (type == 'after')
+				$thead.remove();
+				this.code.sync();
+			},
+			addRowAbove: function()
 			{
-				$current_tr.after(new_tr);
-			}
-			else
+				this.table.addRow('before');
+			},
+			addRowBelow: function()
 			{
-				$current_tr.before(new_tr);
-			}
-
-			this.code.sync();
-		},
-		addColumn: function (type)
-		{
-			var $table = this.table.getTable();
-			if (!$table) return;
-
-			var index = 0;
-			var current = $(this.selection.getCurrent());
-
-			this.buffer.set();
+				this.table.addRow('after');
+			},
+			addColumnLeft: function()
+			{
+				this.table.addColumn('before');
+			},
+			addColumnRight: function()
+			{
+				this.table.addColumn('after');
+			},
+			addRow: function(type)
+			{
+				var $table = this.table.getTable();
+				if (!$table) return;
 
-			var $current_tr = current.closest('tr');
-			var $current_td = current.closest('td, th');
+				this.buffer.set();
 
-			$current_tr.find('td, th').each($.proxy(function(i, elem)
-			{
-				if ($(elem)[0] === $current_td[0]) index = i;
+				var $current = $(this.selection.getCurrent());
+				var $current_tr = $current.closest('tr');
+				var new_tr = $current_tr.clone();
 
-			}, this));
+				new_tr.find('th').replaceWith(function()
+				{
+					var $td = $('<td>');
+					$td[0].attributes = this.attributes;
 
-			$table.find('tr').each($.proxy(function(i, elem)
-			{
-				var $current = $(elem).find('td, th').eq(index);
+					return $td.append($(this).contents());
+				});
 
-				var td = $current.clone();
-				td.html(this.opts.invisibleSpace);
+				new_tr.find('td').html(this.opts.invisibleSpace);
 
 				if (type == 'after')
 				{
-					$current.after(td);
+					$current_tr.after(new_tr);
 				}
 				else
 				{
-					$current.before(td);
+					$current_tr.before(new_tr);
 				}
 
-			}, this));
+				this.code.sync();
+			},
+			addColumn: function (type)
+			{
+				var $table = this.table.getTable();
+				if (!$table) return;
+
+				var index = 0;
+				var current = $(this.selection.getCurrent());
+
+				this.buffer.set();
+
+				var $current_tr = current.closest('tr');
+				var $current_td = current.closest('td, th');
 
-			this.code.sync();
-		}
+				$current_tr.find('td, th').each($.proxy(function(i, elem)
+				{
+					if ($(elem)[0] === $current_td[0]) index = i;
+
+				}, this));
+
+				$table.find('tr').each($.proxy(function(i, elem)
+				{
+					var $current = $(elem).find('td, th').eq(index);
+
+					var td = $current.clone();
+					td.html(this.opts.invisibleSpace);
+
+					if (type == 'after')
+					{
+						$current.after(td);
+					}
+					else
+					{
+						$current.before(td);
+					}
+
+				}, this));
+
+				this.code.sync();
+			}
+		};
 	};
-};
+})(jQuery);