| | |
| | | (function(tinymce) {
|
| | | var DOM = tinymce.DOM, Event = tinymce.dom.Event, extend = tinymce.extend, each = tinymce.each, Cookie = tinymce.util.Cookie, lastExtID, explode = tinymce.explode;
|
| | |
|
| | | // Generates a preview for a format
|
| | | function getPreviewCss(ed, fmt) {
|
| | | var name, previewElm, dom = ed.dom, previewCss = '', parentFontSize, previewStylesName;
|
| | |
|
| | | previewStyles = ed.settings.preview_styles;
|
| | |
|
| | | // No preview forced
|
| | | if (previewStyles === false)
|
| | | return '';
|
| | |
|
| | | // Default preview
|
| | | if (!previewStyles)
|
| | | previewStyles = 'font-family font-size font-weight text-decoration text-transform color background-color';
|
| | |
|
| | | // Removes any variables since these can't be previewed
|
| | | function removeVars(val) {
|
| | | return val.replace(/%(\w+)/g, '');
|
| | | };
|
| | |
|
| | | // Create block/inline element to use for preview
|
| | | name = fmt.block || fmt.inline || 'span';
|
| | | previewElm = dom.create(name);
|
| | |
|
| | | // Add format styles to preview element
|
| | | each(fmt.styles, function(value, name) {
|
| | | value = removeVars(value);
|
| | |
|
| | | if (value)
|
| | | dom.setStyle(previewElm, name, value);
|
| | | });
|
| | |
|
| | | // Add attributes to preview element
|
| | | each(fmt.attributes, function(value, name) {
|
| | | value = removeVars(value);
|
| | |
|
| | | if (value)
|
| | | dom.setAttrib(previewElm, name, value);
|
| | | });
|
| | |
|
| | | // Add classes to preview element
|
| | | each(fmt.classes, function(value) {
|
| | | value = removeVars(value);
|
| | |
|
| | | if (!dom.hasClass(previewElm, value))
|
| | | dom.addClass(previewElm, value);
|
| | | });
|
| | |
|
| | | // Add the previewElm outside the visual area
|
| | | dom.setStyles(previewElm, {position: 'absolute', left: -0xFFFF});
|
| | | ed.getBody().appendChild(previewElm);
|
| | |
|
| | | // Get parent container font size so we can compute px values out of em/% for older IE:s
|
| | | parentFontSize = dom.getStyle(ed.getBody(), 'fontSize', true);
|
| | | parentFontSize = /px$/.test(parentFontSize) ? parseInt(parentFontSize, 10) : 0;
|
| | |
|
| | | each(previewStyles.split(' '), function(name) {
|
| | | var value = dom.getStyle(previewElm, name, true);
|
| | |
|
| | | // If background is transparent then check if the body has a background color we can use
|
| | | if (name == 'background-color' && /transparent|rgba\s*\([^)]+,\s*0\)/.test(value)) {
|
| | | value = dom.getStyle(ed.getBody(), name, true);
|
| | |
|
| | | // Ignore white since it's the default color, not the nicest fix
|
| | | if (dom.toHex(value).toLowerCase() == '#ffffff') {
|
| | | return;
|
| | | }
|
| | | }
|
| | |
|
| | | // Old IE won't calculate the font size so we need to do that manually
|
| | | if (name == 'font-size') {
|
| | | if (/em|%$/.test(value)) {
|
| | | if (parentFontSize === 0) {
|
| | | return;
|
| | | }
|
| | |
|
| | | // Convert font size from em/% to px
|
| | | value = parseFloat(value, 10) / (/%$/.test(value) ? 100 : 1);
|
| | | value = (value * parentFontSize) + 'px';
|
| | | }
|
| | | }
|
| | |
|
| | | previewCss += name + ':' + value + ';';
|
| | | });
|
| | |
|
| | | dom.remove(previewElm);
|
| | |
|
| | | return previewCss;
|
| | | };
|
| | |
|
| | | // Tell it to load theme specific language pack(s)
|
| | | tinymce.ThemeManager.requireLangPack('advanced');
|
| | |
|
| | |
| | | t.editor = ed;
|
| | | t.url = url;
|
| | | t.onResolveName = new tinymce.util.Dispatcher(this);
|
| | | s = ed.settings;
|
| | |
|
| | | ed.forcedHighContrastMode = ed.settings.detect_highcontrast && t._isHighContrast();
|
| | | ed.settings.skin = ed.forcedHighContrastMode ? 'highcontrast' : ed.settings.skin;
|
| | |
|
| | | // Setup default buttons
|
| | | if (!s.theme_advanced_buttons1) {
|
| | | s = extend({
|
| | | theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect",
|
| | | theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code",
|
| | | theme_advanced_buttons3 : "hr,removeformat,visualaid,|,sub,sup,|,charmap"
|
| | | }, s);
|
| | | }
|
| | | |
| | | // Default settings
|
| | | t.settings = s = extend({
|
| | | theme_advanced_path : true,
|
| | | theme_advanced_toolbar_location : 'bottom',
|
| | | theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect",
|
| | | theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code",
|
| | | theme_advanced_buttons3 : "hr,removeformat,visualaid,|,sub,sup,|,charmap",
|
| | | theme_advanced_toolbar_location : 'top',
|
| | | theme_advanced_blockformats : "p,address,pre,h1,h2,h3,h4,h5,h6",
|
| | | theme_advanced_toolbar_align : "center",
|
| | | theme_advanced_toolbar_align : "left",
|
| | | theme_advanced_statusbar_location : "bottom",
|
| | | theme_advanced_fonts : "Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats",
|
| | | theme_advanced_more_colors : 1,
|
| | | theme_advanced_row_height : 23,
|
| | |
| | | theme_advanced_font_selector : "span",
|
| | | theme_advanced_show_current_color: 0,
|
| | | readonly : ed.settings.readonly
|
| | | }, ed.settings);
|
| | | }, s);
|
| | |
|
| | | // Setup default font_size_style_values
|
| | | if (!s.font_size_style_values)
|
| | |
| | |
|
| | | if (ctrl.getLength() == 0) {
|
| | | each(ed.dom.getClasses(), function(o, idx) {
|
| | | var name = 'style_' + idx;
|
| | | var name = 'style_' + idx, fmt;
|
| | |
|
| | | ed.formatter.register(name, {
|
| | | fmt = {
|
| | | inline : 'span',
|
| | | attributes : {'class' : o['class']},
|
| | | selector : '*'
|
| | | });
|
| | | };
|
| | |
|
| | | ctrl.add(o['class'], name);
|
| | | ed.formatter.register(name, fmt);
|
| | |
|
| | | ctrl.add(o['class'], name, {
|
| | | style: function() {
|
| | | return getPreviewCss(ed, fmt);
|
| | | }
|
| | | });
|
| | | });
|
| | | }
|
| | | },
|
| | |
| | | ctrl = ctrlMan.createListBox('styleselect', {
|
| | | title : 'advanced.style_select',
|
| | | onselect : function(name) {
|
| | | var matches, formatNames = [];
|
| | | var matches, formatNames = [], removedFormat;
|
| | |
|
| | | each(ctrl.items, function(item) {
|
| | | formatNames.push(item.value);
|
| | |
| | | ed.focus();
|
| | | ed.undoManager.add();
|
| | |
|
| | | // Toggle off the current format
|
| | | // Toggle off the current format(s)
|
| | | matches = ed.formatter.matchAll(formatNames);
|
| | | if (!name || matches[0] == name) {
|
| | | if (matches[0]) |
| | | ed.formatter.remove(matches[0]);
|
| | | } else
|
| | | tinymce.each(matches, function(match) {
|
| | | if (!name || match == name) {
|
| | | if (match)
|
| | | ed.formatter.remove(match);
|
| | |
|
| | | removedFormat = true;
|
| | | }
|
| | | });
|
| | |
|
| | | if (!removedFormat)
|
| | | ed.formatter.apply(name);
|
| | |
|
| | | ed.undoManager.add();
|
| | |
| | | });
|
| | |
|
| | | // Handle specified format
|
| | | ed.onInit.add(function() {
|
| | | ed.onPreInit.add(function() {
|
| | | var counter = 0, formats = ed.getParam('style_formats');
|
| | |
|
| | | if (formats) {
|
| | |
| | | if (keys > 1) {
|
| | | name = fmt.name = fmt.name || 'style_' + (counter++);
|
| | | ed.formatter.register(name, fmt);
|
| | | ctrl.add(fmt.title, name);
|
| | | ctrl.add(fmt.title, name, {
|
| | | style: function() {
|
| | | return getPreviewCss(ed, fmt);
|
| | | }
|
| | | });
|
| | | } else
|
| | | ctrl.add(fmt.title);
|
| | | });
|
| | | } else {
|
| | | each(ed.getParam('theme_advanced_styles', '', 'hash'), function(val, key) {
|
| | | var name;
|
| | | var name, fmt;
|
| | |
|
| | | if (val) {
|
| | | name = 'style_' + (counter++);
|
| | |
|
| | | ed.formatter.register(name, {
|
| | | fmt = {
|
| | | inline : 'span',
|
| | | classes : val,
|
| | | selector : '*'
|
| | | });
|
| | | };
|
| | |
|
| | | ctrl.add(t.editor.translate(key), name);
|
| | | ed.formatter.register(name, fmt);
|
| | | ctrl.add(t.editor.translate(key), name, {
|
| | | style: function() {
|
| | | return getPreviewCss(ed, fmt);
|
| | | }
|
| | | });
|
| | | }
|
| | | });
|
| | | }
|
| | |
| | | return v == sv;
|
| | | });
|
| | |
|
| | | if (cur && (cur.value.fontSize == v.fontSize || cur.value['class'] == v['class'])) {
|
| | | if (cur && (cur.value.fontSize == v.fontSize || cur.value['class'] && cur.value['class'] == v['class'])) {
|
| | | c.select(null);
|
| | | }
|
| | |
|
| | |
| | |
|
| | | if (c) {
|
| | | each(t.editor.getParam('theme_advanced_blockformats', t.settings.theme_advanced_blockformats, 'hash'), function(v, k) {
|
| | | c.add(t.editor.translate(k != v ? k : fmts[v]), v, {'class' : 'mce_formatPreview mce_' + v});
|
| | | c.add(t.editor.translate(k != v ? k : fmts[v]), v, {'class' : 'mce_formatPreview mce_' + v, style: function() {
|
| | | return getPreviewCss(t.editor, {block: v});
|
| | | }});
|
| | | });
|
| | | }
|
| | |
|
| | |
| | |
|
| | | // TODO: ACC Should have an aria-describedby attribute which is user-configurable to describe what this field is actually for.
|
| | | // Maybe actually inherit it from the original textara?
|
| | | n = p = DOM.create('span', {role : 'application', 'aria-labelledby' : ed.id + '_voice', id : ed.id + '_parent', 'class' : 'mceEditor ' + ed.settings.skin + 'Skin' + (s.skin_variant ? ' ' + ed.settings.skin + 'Skin' + t._ufirst(s.skin_variant) : '')});
|
| | | n = p = DOM.create('span', {role : 'application', 'aria-labelledby' : ed.id + '_voice', id : ed.id + '_parent', 'class' : 'mceEditor ' + ed.settings.skin + 'Skin' + (s.skin_variant ? ' ' + ed.settings.skin + 'Skin' + t._ufirst(s.skin_variant) : '') + (ed.settings.directionality == "rtl" ? ' mceRtl' : '')});
|
| | | DOM.add(n, 'span', {'class': 'mceVoiceLabel', 'style': 'display:none;', id: ed.id + '_voice'}, s.aria_label);
|
| | |
|
| | | if (!DOM.boxModel)
|
| | |
| | |
|
| | | if (e.nodeName == 'A') {
|
| | | t._sel(e.className.replace(/^.*mcePath_([0-9]+).*$/, '$1'));
|
| | |
|
| | | return Event.cancel(e);
|
| | | return false;
|
| | | }
|
| | | });
|
| | | /*
|
| | |
| | |
|
| | | if (evt.altKey) {
|
| | | if (evt.keyCode === DOM_VK_F10) {
|
| | | window.focus();
|
| | | // Make sure focus is given to toolbar in Safari.
|
| | | // We can't do this in IE as it prevents giving focus to toolbar when editor is in a frame
|
| | | if (tinymce.isWebKit) {
|
| | | window.focus();
|
| | | }
|
| | | t.toolbarGroup.focus();
|
| | | return Event.cancel(evt);
|
| | | } else if (evt.keyCode === DOM_VK_F11) {
|
| | |
| | | var f = Event.add(ed.id + '_external_close', 'click', function() {
|
| | | DOM.hide(ed.id + '_external');
|
| | | Event.remove(ed.id + '_external_close', 'click', f);
|
| | | return false;
|
| | | });
|
| | |
|
| | | DOM.show(e);
|
| | |
| | | },
|
| | |
|
| | | _addToolbars : function(c, o) {
|
| | | var t = this, i, tb, ed = t.editor, s = t.settings, v, cf = ed.controlManager, di, n, h = [], a, toolbarGroup;
|
| | | var t = this, i, tb, ed = t.editor, s = t.settings, v, cf = ed.controlManager, di, n, h = [], a, toolbarGroup, toolbarsExist = false;
|
| | |
|
| | | toolbarGroup = cf.createToolbarGroup('toolbargroup', {
|
| | | 'name': ed.getLang('advanced.toolbar'),
|
| | |
| | |
|
| | | // Create toolbar and add the controls
|
| | | for (i=1; (v = s['theme_advanced_buttons' + i]); i++) {
|
| | | toolbarsExist = true;
|
| | | tb = cf.createToolbar("toolbar" + i, {'class' : 'mceToolbarRow' + i});
|
| | |
|
| | | if (s['theme_advanced_buttons' + i + '_add'])
|
| | |
| | |
|
| | | o.deltaHeight -= s.theme_advanced_row_height;
|
| | | }
|
| | | // Handle case when there are no toolbar buttons and ensure editor height is adjusted accordingly
|
| | | if (!toolbarsExist)
|
| | | o.deltaHeight -= s.theme_advanced_row_height;
|
| | | h.push(toolbarGroup.renderHTML());
|
| | | h.push(DOM.createHTML('a', {href : '#', accesskey : 'z', title : ed.getLang("advanced.toolbar_focus"), onfocus : 'tinyMCE.getInstanceById(\'' + ed.id + '\').focus();'}, '<!-- IE -->'));
|
| | | DOM.setHTML(n, h.join(''));
|
| | |
| | | width = startWidth + (e.screenX - startX);
|
| | | height = startHeight + (e.screenY - startY);
|
| | | t.resizeTo(width, height, true);
|
| | |
|
| | | ed.nodeChanged();
|
| | | };
|
| | |
|
| | | e.preventDefault();
|
| | |
| | |
|
| | | p = getParent('A');
|
| | | if (c = cm.get('link')) {
|
| | | if (!p || !p.name) {
|
| | | c.setDisabled(!p && co);
|
| | | c.setActive(!!p);
|
| | | }
|
| | | c.setDisabled((!p && co) || (p && !p.href));
|
| | | c.setActive(!!p && (!p.name && !p.id));
|
| | | }
|
| | |
|
| | | if (c = cm.get('unlink')) {
|
| | | c.setDisabled(!p && co);
|
| | | c.setActive(!!p && !p.name);
|
| | | c.setActive(!!p && !p.name && !p.id);
|
| | | }
|
| | |
|
| | | if (c = cm.get('anchor')) {
|
| | | c.setActive(!co && !!p && p.name);
|
| | | c.setActive(!co && !!p && (p.name || (p.id && !p.href)));
|
| | | }
|
| | |
|
| | | p = getParent('IMG');
|
| | |
| | |
|
| | | matches = ed.formatter.matchAll(formatNames);
|
| | | c.select(matches[0]);
|
| | | tinymce.each(matches, function(match, index) {
|
| | | if (index > 0) {
|
| | | c.mark(match);
|
| | | }
|
| | | });
|
| | | }
|
| | |
|
| | | if (c = cm.get('formatselect')) {
|
| | | p = getParent(DOM.isBlock);
|
| | | p = getParent(ed.dom.isBlock);
|
| | |
|
| | | if (p)
|
| | | c.select(p.nodeName.toLowerCase());
|
| | |
| | | return;
|
| | |
|
| | | // Handle prefix
|
| | | if (tinymce.isIE && n.scopeName !== 'HTML')
|
| | | if (tinymce.isIE && n.scopeName !== 'HTML' && n.scopeName)
|
| | | na = n.scopeName + ':' + na;
|
| | |
|
| | | // Remove internal prefix
|
| | |
| | | ti += 'id: ' + v + ' ';
|
| | |
|
| | | if (v = n.className) {
|
| | | v = v.replace(/\b\s*(webkit|mce|Apple-)\w+\s*\b/g, '')
|
| | | v = v.replace(/\b\s*(webkit|mce|Apple-)\w+\s*\b/g, '');
|
| | |
|
| | | if (v) {
|
| | | ti += 'class: ' + v + ' ';
|
| | |
|
| | | if (DOM.isBlock(n) || na == 'img' || na == 'span')
|
| | | if (ed.dom.isBlock(n) || na == 'img' || na == 'span')
|
| | | na += '.' + v;
|
| | | }
|
| | | }
|
| | |
| | | ed.windowManager.open({
|
| | | url : this.url + '/charmap.htm',
|
| | | width : 550 + parseInt(ed.getLang('advanced.charmap_delta_width', 0)),
|
| | | height : 250 + parseInt(ed.getLang('advanced.charmap_delta_height', 0)),
|
| | | height : 265 + parseInt(ed.getLang('advanced.charmap_delta_height', 0)),
|
| | | inline : true
|
| | | }, {
|
| | | theme_url : this.url
|
| | |
| | | var ed = this.editor;
|
| | |
|
| | | // Internal image object like a flash placeholder
|
| | | if (ed.dom.getAttrib(ed.selection.getNode(), 'class').indexOf('mceItem') != -1)
|
| | | if (ed.dom.getAttrib(ed.selection.getNode(), 'class', '').indexOf('mceItem') != -1)
|
| | | return;
|
| | |
|
| | | ed.windowManager.open({
|