fork
This commit is contained in:
root
145
util/tag-editor/colorbox/colorbox.css
Normal file
145
util/tag-editor/colorbox/colorbox.css
Normal file
@ -0,0 +1,145 @@
|
||||
/*
|
||||
Colorbox Core Style:
|
||||
The following CSS is consistent between example themes and should not be altered.
|
||||
*/
|
||||
#colorbox.crayon-colorbox, #cboxOverlay.crayon-colorbox, .crayon-colorbox #cboxWrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9999;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#cboxOverlay.crayon-colorbox {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxMiddleLeft, .crayon-colorbox #cboxBottomLeft {
|
||||
clear: left;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxContent {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxLoadedContent {
|
||||
overflow: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxTitle {
|
||||
/* Fixes overlay issue preventing tag editor controls from being selected */
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxLoadingOverlay, .crayon-colorbox #cboxLoadingGraphic {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxPrevious, .crayon-colorbox #cboxNext, .crayon-colorbox #cboxClose, .crayon-colorbox #cboxSlideshow {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.crayon-colorbox .cboxPhoto {
|
||||
float: left;
|
||||
margin: auto;
|
||||
border: 0;
|
||||
display: block;
|
||||
max-width: none;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
}
|
||||
|
||||
.crayon-colorbox .cboxIframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
#colorbox.crayon-colorbox, .crayon-colorbox #cboxContent, .crayon-colorbox #cboxLoadedContent {
|
||||
box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box;
|
||||
}
|
||||
|
||||
/*
|
||||
User Style:
|
||||
Change the following styles to modify the appearance of Colorbox. They are
|
||||
ordered & tabbed in a way that represents the nesting of the generated HTML.
|
||||
*/
|
||||
#cboxOverlay.crayon-colorbox {
|
||||
background: #000;
|
||||
}
|
||||
|
||||
#colorbox.crayon-colorbox {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxContent {
|
||||
margin-top: 20px;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
.crayon-colorbox .cboxIframe {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxError {
|
||||
padding: 50px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxLoadedContent {
|
||||
border: 5px solid #000;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxTitle {
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
left: 0;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxCurrent {
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
right: 0px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
|
||||
.crayon-colorbox #cboxPrevious, .crayon-colorbox #cboxNext, .crayon-colorbox #cboxSlideshow, .crayon-colorbox #cboxClose {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
width: auto;
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
|
||||
.crayon-colorbox #cboxPrevious:active, .crayon-colorbox #cboxNext:active, .crayon-colorbox #cboxSlideshow:active, .crayon-colorbox #cboxClose:active {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxSlideshow {
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
right: 90px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxContent {
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
.crayon-colorbox #cboxLoadedContent {
|
||||
border: 0
|
||||
}
|
||||
7
util/tag-editor/colorbox/jquery.colorbox-min.js
vendored
Normal file
7
util/tag-editor/colorbox/jquery.colorbox-min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
51
util/tag-editor/crayon_qt.js
Normal file
51
util/tag-editor/crayon_qt.js
Normal file
@ -0,0 +1,51 @@
|
||||
(function ($) {
|
||||
|
||||
var settings = CrayonTagEditorSettings;
|
||||
|
||||
window.CrayonQuickTags = new function () {
|
||||
|
||||
var base = this;
|
||||
|
||||
base.init = function () {
|
||||
base.sel = '*[id*="crayon_quicktag"],*[class*="crayon_quicktag"]';
|
||||
var buttonText = settings.quicktag_text;
|
||||
buttonText = buttonText !== undefined ? buttonText : 'crayon';
|
||||
QTags.addButton('crayon_quicktag', buttonText, function () {
|
||||
CrayonTagEditor.showDialog({
|
||||
insert: function (shortcode) {
|
||||
QTags.insertContent(shortcode);
|
||||
},
|
||||
select: base.getSelectedText,
|
||||
editor_str: 'html',
|
||||
output: 'encode'
|
||||
});
|
||||
$(base.sel).removeClass('qt_crayon_highlight');
|
||||
});
|
||||
var qt_crayon;
|
||||
var find_qt_crayon = setInterval(function () {
|
||||
qt_crayon = $(base.sel).first();
|
||||
if (typeof qt_crayon != 'undefined') {
|
||||
CrayonTagEditor.bind(base.sel);
|
||||
clearInterval(find_qt_crayon);
|
||||
}
|
||||
}, 100);
|
||||
};
|
||||
|
||||
base.getSelectedText = function () {
|
||||
if (QTags.instances.length == 0) {
|
||||
return null;
|
||||
} else {
|
||||
var qt = QTags.instances[0];
|
||||
var startPos = qt.canvas.selectionStart;
|
||||
var endPos = qt.canvas.selectionEnd;
|
||||
return qt.canvas.value.substring(startPos, endPos);
|
||||
}
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
$(document).ready(function () {
|
||||
CrayonQuickTags.init();
|
||||
});
|
||||
|
||||
})(jQueryCrayon);
|
||||
631
util/tag-editor/crayon_tag_editor.js
Normal file
631
util/tag-editor/crayon_tag_editor.js
Normal file
@ -0,0 +1,631 @@
|
||||
(function ($) {
|
||||
|
||||
window.CrayonTagEditor = new function () {
|
||||
var base = this;
|
||||
|
||||
var isInit = false;
|
||||
var loaded = false;
|
||||
var editing = false;
|
||||
var insertCallback, editCallback, showCallback, hideCallback, selectCallback;
|
||||
// Used for encoding, decoding
|
||||
var inputHTML, outputHTML, editor_name, ajax_class_timer;
|
||||
var ajax_class_timer_count = 0;
|
||||
|
||||
var code_refresh, url_refresh;
|
||||
|
||||
// Current $ obj of pre node
|
||||
var currCrayon = null;
|
||||
// Classes from pre node, excl. settings
|
||||
var currClasses = '';
|
||||
// Whether to make span or pre
|
||||
var is_inline = false;
|
||||
|
||||
// Generated in WP and contains the settings
|
||||
var s, gs, util;
|
||||
|
||||
// CSS
|
||||
var dialog, code, clear, submit, cancel;
|
||||
|
||||
var colorboxSettings = {
|
||||
inline: true,
|
||||
width: 690,
|
||||
height: '90%',
|
||||
closeButton: false,
|
||||
fixed: true,
|
||||
transition: 'none',
|
||||
className: 'crayon-colorbox',
|
||||
onOpen: function () {
|
||||
$(this.outer).prepend($(s.bar_content));
|
||||
},
|
||||
onComplete: function () {
|
||||
$(s.code_css).focus();
|
||||
},
|
||||
onCleanup: function () {
|
||||
$(s.bar).prepend($(s.bar_content));
|
||||
}
|
||||
};
|
||||
|
||||
base.init = function () {
|
||||
s = CrayonTagEditorSettings;
|
||||
gs = CrayonSyntaxSettings;
|
||||
util = CrayonUtil;
|
||||
// This allows us to call $.colorbox and reload without needing a button click.
|
||||
colorboxSettings.href = s.content_css;
|
||||
};
|
||||
|
||||
base.bind = function (buttonCls) {
|
||||
if (!isInit) {
|
||||
isInit = true;
|
||||
base.init();
|
||||
}
|
||||
var $buttons = $(buttonCls);
|
||||
$buttons.each(function (i, button) {
|
||||
var $button = $(button);
|
||||
var $wrapper = $('<a class="crayon-tag-editor-button-wrapper"></a>').attr('href', s.content_css);
|
||||
$button.after($wrapper);
|
||||
$wrapper.append($button);
|
||||
$wrapper.colorbox(colorboxSettings);
|
||||
});
|
||||
};
|
||||
|
||||
base.hide = function () {
|
||||
$.colorbox.close();
|
||||
return false;
|
||||
};
|
||||
|
||||
// XXX Loads dialog contents
|
||||
base.loadDialog = function (callback) {
|
||||
// Loaded once url is given
|
||||
if (!loaded) {
|
||||
loaded = true;
|
||||
} else {
|
||||
callback && callback();
|
||||
return;
|
||||
}
|
||||
// Load the editor content
|
||||
CrayonUtil.getAJAX({action: 'crayon-tag-editor', is_admin: gs.is_admin}, function (data) {
|
||||
dialog = $('<div id="' + s.css + '"></div>');
|
||||
dialog.appendTo('body').hide();
|
||||
dialog.html(data);
|
||||
|
||||
base.setOrigValues();
|
||||
|
||||
submit = dialog.find(s.submit_css);
|
||||
cancel = dialog.find(s.cancel_css);
|
||||
|
||||
code = $(s.code_css);
|
||||
clear = $('#crayon-te-clear');
|
||||
code_refresh = function () {
|
||||
var clear_visible = clear.is(":visible");
|
||||
if (code.val().length > 0 && !clear_visible) {
|
||||
clear.show();
|
||||
code.removeClass(gs.selected);
|
||||
} else if (code.val().length <= 0) {
|
||||
clear.hide();
|
||||
}
|
||||
};
|
||||
|
||||
code.keyup(code_refresh);
|
||||
code.change(code_refresh);
|
||||
clear.click(function () {
|
||||
code.val('');
|
||||
code.removeClass(gs.selected);
|
||||
code.focus();
|
||||
});
|
||||
|
||||
var url = $(s.url_css);
|
||||
var url_info = $(s.url_info_css);
|
||||
var exts = CrayonTagEditorSettings.extensions;
|
||||
url_refresh = function () {
|
||||
if (url.val().length > 0 && !url_info.is(":visible")) {
|
||||
url_info.show();
|
||||
url.removeClass(gs.selected);
|
||||
} else if (url.val().length <= 0) {
|
||||
url_info.hide();
|
||||
}
|
||||
|
||||
// Check for extensions and select language automatically
|
||||
var ext = CrayonUtil.getExt(url.val());
|
||||
if (ext) {
|
||||
var lang = exts[ext];
|
||||
// Otherwise use the extention as the lang
|
||||
var lang_id = lang ? lang : ext;
|
||||
var final_lang = CrayonTagEditorSettings.fallback_lang;
|
||||
$(s.lang_css + ' option').each(function () {
|
||||
if ($(this).val() == lang_id) {
|
||||
final_lang = lang_id;
|
||||
}
|
||||
});
|
||||
$(s.lang_css).val(final_lang);
|
||||
}
|
||||
};
|
||||
url.keyup(url_refresh);
|
||||
url.change(url_refresh);
|
||||
|
||||
var setting_change = function () {
|
||||
var setting = $(this);
|
||||
var orig_value = $(this).attr(gs.orig_value);
|
||||
if (typeof orig_value == 'undefined') {
|
||||
orig_value = '';
|
||||
}
|
||||
// Depends on type
|
||||
var value = base.settingValue(setting);
|
||||
CrayonUtil.log(setting.attr('id') + ' value: ' + value);
|
||||
var highlight = null;
|
||||
if (setting.is('input[type=checkbox]')) {
|
||||
highlight = setting.next('span');
|
||||
}
|
||||
|
||||
CrayonUtil.log(' >>> ' + setting.attr('id') + ' is ' + orig_value + ' = ' + value);
|
||||
if (orig_value == value) {
|
||||
// No change
|
||||
setting.removeClass(gs.changed);
|
||||
if (highlight) {
|
||||
highlight.removeClass(gs.changed);
|
||||
}
|
||||
} else {
|
||||
// Changed
|
||||
setting.addClass(gs.changed);
|
||||
if (highlight) {
|
||||
highlight.addClass(gs.changed);
|
||||
}
|
||||
}
|
||||
// Save standardized value for later
|
||||
base.settingValue(setting, value);
|
||||
};
|
||||
$('.' + gs.setting + '[id]:not(.' + gs.special + ')').each(function () {
|
||||
$(this).change(setting_change);
|
||||
$(this).keyup(setting_change);
|
||||
});
|
||||
callback && callback();
|
||||
});
|
||||
};
|
||||
|
||||
// XXX Displays the dialog.
|
||||
base.showDialog = function (args) {
|
||||
var wasLoaded = loaded;
|
||||
base.loadDialog(function () {
|
||||
if (!wasLoaded) {
|
||||
// Forcefully load the colorbox. Otherwise it populates the content after opening the window and
|
||||
// never renders.
|
||||
$.colorbox(colorboxSettings);
|
||||
}
|
||||
base._showDialog(args);
|
||||
});
|
||||
};
|
||||
|
||||
base._showDialog = function (args) {
|
||||
args = $.extend({
|
||||
insert: null,
|
||||
edit: null,
|
||||
show: null,
|
||||
hide: base.hide,
|
||||
select: null,
|
||||
editor_str: null,
|
||||
ed: null,
|
||||
node: null,
|
||||
input: null,
|
||||
output: null
|
||||
}, args);
|
||||
|
||||
// Need to reset all settings back to original, clear yellow highlighting
|
||||
base.resetSettings();
|
||||
// Save these for when we add a Crayon
|
||||
insertCallback = args.insert;
|
||||
editCallback = args.edit;
|
||||
showCallback = args.show;
|
||||
hideCallback = args.hide;
|
||||
selectCallback = args.select;
|
||||
inputHTML = args.input;
|
||||
outputHTML = args.output;
|
||||
editor_name = args.editor_str;
|
||||
var currNode = args.node;
|
||||
var currNode = args.node;
|
||||
is_inline = false;
|
||||
|
||||
// Unbind submit
|
||||
submit.unbind();
|
||||
submit.click(function (e) {
|
||||
base.submitButton();
|
||||
e.preventDefault();
|
||||
});
|
||||
base.setSubmitText(s.submit_add);
|
||||
|
||||
cancel.unbind();
|
||||
cancel.click(function (e) {
|
||||
base.hide();
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
if (base.isCrayon(currNode)) {
|
||||
currCrayon = $(currNode);
|
||||
if (currCrayon.length != 0) {
|
||||
// Read back settings for editing
|
||||
currClasses = currCrayon.attr('class');
|
||||
var re = new RegExp('\\b([A-Za-z-]+)' + s.attr_sep + '(\\S+)', 'gim');
|
||||
var matches = re.execAll(currClasses);
|
||||
// Retain all other classes, remove settings
|
||||
currClasses = $.trim(currClasses.replace(re, ''));
|
||||
var atts = {};
|
||||
for (var i in matches) {
|
||||
var id = matches[i][1];
|
||||
var value = matches[i][2];
|
||||
atts[id] = value;
|
||||
}
|
||||
|
||||
// Title
|
||||
var title = currCrayon.attr('title');
|
||||
if (title) {
|
||||
atts['title'] = title;
|
||||
}
|
||||
|
||||
// URL
|
||||
var url = currCrayon.attr('data-url');
|
||||
if (url) {
|
||||
atts['url'] = url;
|
||||
}
|
||||
|
||||
// Inverted settings
|
||||
if (typeof atts['highlight'] != 'undefined') {
|
||||
atts['highlight'] = '0' ? '1' : '0';
|
||||
}
|
||||
|
||||
// Inline
|
||||
is_inline = currCrayon.hasClass(s.inline_css);
|
||||
atts['inline'] = is_inline ? '1' : '0';
|
||||
|
||||
// Ensure language goes to fallback if invalid
|
||||
var avail_langs = [];
|
||||
$(s.lang_css + ' option').each(function () {
|
||||
var value = $(this).val();
|
||||
if (value) {
|
||||
avail_langs.push(value);
|
||||
}
|
||||
});
|
||||
if ($.inArray(atts['lang'], avail_langs) == -1) {
|
||||
atts['lang'] = s.fallback_lang;
|
||||
}
|
||||
|
||||
// Validate the attributes
|
||||
atts = base.validate(atts);
|
||||
|
||||
// Load in attributes, add prefix
|
||||
for (var att in atts) {
|
||||
var setting = $('#' + gs.prefix + att + '.' + gs.setting);
|
||||
var value = atts[att];
|
||||
base.settingValue(setting, value);
|
||||
// Update highlights
|
||||
setting.change();
|
||||
// If global setting changes and we access settings, it should declare loaded settings as changed even if they equal the global value, just so they aren't lost on save
|
||||
if (!setting.hasClass(gs.special)) {
|
||||
setting.addClass(gs.changed);
|
||||
if (setting.is('input[type=checkbox]')) {
|
||||
highlight = setting.next('span');
|
||||
highlight.addClass(gs.changed);
|
||||
}
|
||||
}
|
||||
CrayonUtil.log('loaded: ' + att + ':' + value);
|
||||
}
|
||||
|
||||
editing = true;
|
||||
base.setSubmitText(s.submit_edit);
|
||||
|
||||
// Code
|
||||
var content = currCrayon.html();
|
||||
if (inputHTML == 'encode') {
|
||||
content = CrayonUtil.encode_html(content);
|
||||
} else if (inputHTML == 'decode') {
|
||||
content = CrayonUtil.decode_html(content);
|
||||
}
|
||||
code.val(content);
|
||||
|
||||
} else {
|
||||
CrayonUtil.log('cannot load currNode of type pre');
|
||||
}
|
||||
} else {
|
||||
if (selectCallback) {
|
||||
// Add selected content as code
|
||||
code.val(selectCallback);
|
||||
}
|
||||
// We are creating a new Crayon, not editing
|
||||
editing = false;
|
||||
base.setSubmitText(s.submit_add);
|
||||
currCrayon = null;
|
||||
currClasses = '';
|
||||
}
|
||||
|
||||
// Inline
|
||||
var inline = $('#' + s.inline_css);
|
||||
inline.change(function () {
|
||||
is_inline = $(this).is(':checked');
|
||||
var inline_hide = $('.' + s.inline_hide_css);
|
||||
var inline_single = $('.' + s.inline_hide_only_css);
|
||||
var disabled = [s.mark_css, s.range_css, s.title_css, s.url_css];
|
||||
|
||||
for (var i in disabled) {
|
||||
var obj = $(disabled[i]);
|
||||
obj.attr('disabled', is_inline);
|
||||
}
|
||||
|
||||
if (is_inline) {
|
||||
inline_hide.hide();
|
||||
inline_single.hide();
|
||||
inline_hide.closest('tr').hide();
|
||||
for (var i in disabled) {
|
||||
var obj = $(disabled[i]);
|
||||
obj.addClass('crayon-disabled');
|
||||
}
|
||||
} else {
|
||||
inline_hide.show();
|
||||
inline_single.show();
|
||||
inline_hide.closest('tr').show();
|
||||
for (var i in disabled) {
|
||||
var obj = $(disabled[i]);
|
||||
obj.removeClass('crayon-disabled');
|
||||
}
|
||||
}
|
||||
});
|
||||
inline.change();
|
||||
|
||||
// Show the dialog
|
||||
var dialog_title = editing ? s.edit_text : s.add_text;
|
||||
$(s.dialog_title_css).html(dialog_title);
|
||||
if (showCallback) {
|
||||
showCallback();
|
||||
}
|
||||
|
||||
code.focus();
|
||||
code_refresh();
|
||||
url_refresh();
|
||||
if (ajax_class_timer) {
|
||||
clearInterval(ajax_class_timer);
|
||||
ajax_class_timer_count = 0;
|
||||
}
|
||||
|
||||
var ajax_window = $('#TB_window');
|
||||
ajax_window.hide();
|
||||
var fallback = function () {
|
||||
ajax_window.show();
|
||||
// Prevent draw artifacts
|
||||
var oldScroll = $(window).scrollTop();
|
||||
$(window).scrollTop(oldScroll + 10);
|
||||
$(window).scrollTop(oldScroll - 10);
|
||||
};
|
||||
|
||||
ajax_class_timer = setInterval(function () {
|
||||
if (typeof ajax_window != 'undefined' && !ajax_window.hasClass('crayon-te-ajax')) {
|
||||
ajax_window.addClass('crayon-te-ajax');
|
||||
clearInterval(ajax_class_timer);
|
||||
fallback();
|
||||
}
|
||||
if (ajax_class_timer_count >= 100) {
|
||||
// In case it never loads, terminate
|
||||
clearInterval(ajax_class_timer);
|
||||
fallback();
|
||||
}
|
||||
ajax_class_timer_count++;
|
||||
}, 40);
|
||||
};
|
||||
|
||||
// XXX Add Crayon to editor
|
||||
base.addCrayon = function () {
|
||||
var url = $(s.url_css);
|
||||
if (url.val().length == 0 && code.val().length == 0) {
|
||||
code.addClass(gs.selected);
|
||||
code.focus();
|
||||
return false;
|
||||
}
|
||||
code.removeClass(gs.selected);
|
||||
|
||||
// Add inline for matching with CSS
|
||||
var inline = $('#' + s.inline_css);
|
||||
is_inline = inline.length != 0 && inline.is(':checked');
|
||||
|
||||
// Spacing only for <pre>
|
||||
var br_before = br_after = '';
|
||||
if (!editing) {
|
||||
// Don't add spaces if editing
|
||||
if (!is_inline) {
|
||||
if (editor_name == 'html') {
|
||||
br_after = br_before = ' \n';
|
||||
} else {
|
||||
br_after = '<p> </p>';
|
||||
}
|
||||
} else {
|
||||
// Add a space after
|
||||
if (editor_name == 'html') {
|
||||
br_after = br_before = ' ';
|
||||
} else {
|
||||
br_after = ' ';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var tag = (is_inline ? 'span' : 'pre');
|
||||
var shortcode = br_before + '<' + tag + ' ';
|
||||
|
||||
var atts = {};
|
||||
shortcode += 'class="';
|
||||
|
||||
var inline_re = new RegExp('\\b' + s.inline_css + '\\b', 'gim');
|
||||
if (is_inline) {
|
||||
// If don't have inline class, add it
|
||||
if (inline_re.exec(currClasses) == null) {
|
||||
currClasses += ' ' + s.inline_css + ' ';
|
||||
}
|
||||
} else {
|
||||
// Remove inline css if it exists
|
||||
currClasses = currClasses.replace(inline_re, '');
|
||||
}
|
||||
|
||||
// Grab settings as attributes
|
||||
$('.' + gs.changed + '[id],.' + gs.changed + '[' + s.data_value + ']').each(function () {
|
||||
var id = $(this).attr('id');
|
||||
var value = $(this).attr(s.data_value);
|
||||
// Remove prefix
|
||||
id = util.removePrefixFromID(id);
|
||||
atts[id] = value;
|
||||
});
|
||||
|
||||
// Settings
|
||||
atts['lang'] = $(s.lang_css).val();
|
||||
var mark = $(s.mark_css).val();
|
||||
if (mark.length != 0 && !is_inline) {
|
||||
atts['mark'] = mark;
|
||||
}
|
||||
var range = $(s.range_css).val();
|
||||
if (range.length != 0 && !is_inline) {
|
||||
atts['range'] = range;
|
||||
}
|
||||
|
||||
// XXX Code highlighting, checked means 0!
|
||||
if ($(s.hl_css).is(':checked')) {
|
||||
atts['highlight'] = '0';
|
||||
}
|
||||
|
||||
// XXX Very important when working with editor
|
||||
atts['decode'] = 'true';
|
||||
|
||||
// Validate the attributes
|
||||
atts = base.validate(atts);
|
||||
|
||||
for (var id in atts) {
|
||||
// Remove prefix, if exists
|
||||
var value = atts[id];
|
||||
CrayonUtil.log('add ' + id + ':' + value);
|
||||
shortcode += id + s.attr_sep + value + ' ';
|
||||
}
|
||||
|
||||
// Add classes
|
||||
shortcode += currClasses;
|
||||
// Don't forget to close quote for class
|
||||
shortcode += '" ';
|
||||
|
||||
if (!is_inline) {
|
||||
// Title
|
||||
var title = $(s.title_css).val();
|
||||
if (title.length != 0) {
|
||||
shortcode += 'title="' + title + '" ';
|
||||
}
|
||||
// URL
|
||||
var url = $(s.url_css).val();
|
||||
if (url.length != 0) {
|
||||
shortcode += 'data-url="' + url + '" ';
|
||||
}
|
||||
}
|
||||
|
||||
var content = $(s.code_css).val();
|
||||
if (outputHTML == 'encode') {
|
||||
content = CrayonUtil.encode_html(content);
|
||||
} else if (outputHTML == 'decode') {
|
||||
content = CrayonUtil.decode_html(content);
|
||||
}
|
||||
content = typeof content != 'undefined' ? content : '';
|
||||
shortcode += '>' + content + '</' + tag + '>' + br_after;
|
||||
|
||||
if (editing && editCallback) {
|
||||
// Edit the current selected node
|
||||
editCallback(shortcode);
|
||||
} else if (insertCallback) {
|
||||
// Insert the tag and hide dialog
|
||||
insertCallback(shortcode);
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
base.submitButton = function () {
|
||||
CrayonUtil.log('submit');
|
||||
if (base.addCrayon() != false) {
|
||||
base.hideDialog();
|
||||
}
|
||||
};
|
||||
|
||||
base.hideDialog = function () {
|
||||
CrayonUtil.log('hide');
|
||||
if (hideCallback) {
|
||||
hideCallback();
|
||||
}
|
||||
};
|
||||
|
||||
// XXX Auxiliary methods
|
||||
|
||||
base.setOrigValues = function () {
|
||||
$('.' + gs.setting + '[id]').each(function () {
|
||||
var setting = $(this);
|
||||
setting.attr(gs.orig_value, base.settingValue(setting));
|
||||
});
|
||||
};
|
||||
|
||||
base.resetSettings = function () {
|
||||
CrayonUtil.log('reset');
|
||||
$('.' + gs.setting).each(function () {
|
||||
var setting = $(this);
|
||||
base.settingValue(setting, setting.attr(gs.orig_value));
|
||||
// Update highlights
|
||||
setting.change();
|
||||
});
|
||||
code.val('');
|
||||
};
|
||||
|
||||
base.settingValue = function (setting, value) {
|
||||
if (typeof value == 'undefined') {
|
||||
// getter
|
||||
value = '';
|
||||
if (setting.is('input[type=checkbox]')) {
|
||||
// Boolean is stored as string
|
||||
value = setting.is(':checked') ? 'true' : 'false';
|
||||
} else {
|
||||
value = setting.val();
|
||||
}
|
||||
return value;
|
||||
} else {
|
||||
// setter
|
||||
if (setting.is('input[type=checkbox]')) {
|
||||
if (typeof value == 'string') {
|
||||
if (value == 'true' || value == '1') {
|
||||
value = true;
|
||||
} else if (value == 'false' || value == '0') {
|
||||
value = false;
|
||||
}
|
||||
}
|
||||
setting.prop('checked', value);
|
||||
} else {
|
||||
setting.val(value);
|
||||
}
|
||||
setting.attr(s.data_value, value);
|
||||
}
|
||||
};
|
||||
|
||||
base.validate = function (atts) {
|
||||
var fields = ['range', 'mark'];
|
||||
for (var i in fields) {
|
||||
var field = fields[i];
|
||||
if (typeof atts[field] != 'undefined') {
|
||||
atts[field] = atts[field].replace(/\s/g, '');
|
||||
}
|
||||
}
|
||||
return atts;
|
||||
};
|
||||
|
||||
base.isCrayon = function (node) {
|
||||
return node != null &&
|
||||
(node.nodeName == 'PRE' || (node.nodeName == 'SPAN' && $(node).hasClass(s.inline_css)));
|
||||
};
|
||||
|
||||
base.elemValue = function (obj) {
|
||||
var value = null;
|
||||
if (obj.is('input[type=checkbox]')) {
|
||||
value = obj.is(':checked');
|
||||
} else {
|
||||
value = obj.val();
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
||||
base.setSubmitText = function (text) {
|
||||
submit.html(text);
|
||||
};
|
||||
|
||||
};
|
||||
})(jQueryCrayon);
|
||||
292
util/tag-editor/crayon_tag_editor_wp.class.php
Normal file
292
util/tag-editor/crayon_tag_editor_wp.class.php
Normal file
@ -0,0 +1,292 @@
|
||||
<?php
|
||||
|
||||
require_once(CRAYON_ROOT_PATH . 'crayon_settings_wp.class.php');
|
||||
|
||||
class CrayonTagEditorWP {
|
||||
|
||||
public static $settings = null;
|
||||
|
||||
public static function init() {
|
||||
// Hooks
|
||||
if (CRAYON_TAG_EDITOR) {
|
||||
CrayonSettingsWP::load_settings(TRUE);
|
||||
if (is_admin()) {
|
||||
// XXX Only runs in wp-admin
|
||||
add_action('admin_print_scripts-post-new.php', 'CrayonTagEditorWP::enqueue_resources');
|
||||
add_action('admin_print_scripts-post.php', 'CrayonTagEditorWP::enqueue_resources');
|
||||
add_filter('tiny_mce_before_init', 'CrayonTagEditorWP::init_tinymce');
|
||||
// Must come after
|
||||
add_action("admin_print_scripts-post-new.php", 'CrayonSettingsWP::init_js_settings');
|
||||
add_action("admin_print_scripts-post.php", 'CrayonSettingsWP::init_js_settings');
|
||||
self::addbuttons();
|
||||
} else if (CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_FRONT)) {
|
||||
// XXX This will always need to enqueue, but only runs on front end
|
||||
add_action('wp', 'CrayonTagEditorWP::enqueue_resources');
|
||||
add_filter('tiny_mce_before_init', 'CrayonTagEditorWP::init_tinymce');
|
||||
self::addbuttons();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public static function init_settings() {
|
||||
|
||||
if (!self::$settings) {
|
||||
// Add settings
|
||||
self::$settings = array(
|
||||
'home_url' => home_url(),
|
||||
'css' => 'crayon-te',
|
||||
'css_selected' => 'crayon-selected',
|
||||
'code_css' => '#crayon-code',
|
||||
'url_css' => '#crayon-url',
|
||||
'url_info_css' => '#crayon-te-url-info',
|
||||
'lang_css' => '#crayon-lang',
|
||||
'title_css' => '#crayon-title',
|
||||
'mark_css' => '#crayon-mark',
|
||||
'range_css' => '#crayon-range',
|
||||
'inline_css' => 'crayon-inline',
|
||||
'inline_hide_css' => 'crayon-hide-inline',
|
||||
'inline_hide_only_css' => 'crayon-hide-inline-only',
|
||||
'hl_css' => '#crayon-highlight',
|
||||
'switch_html' => '#content-html',
|
||||
'switch_tmce' => '#content-tmce',
|
||||
'tinymce_button_generic' => '.mce-btn',
|
||||
'tinymce_button' => 'a.mce_crayon_tinymce,.mce-i-crayon_tinymce',
|
||||
'tinymce_button_unique' => 'mce_crayon_tinymce',
|
||||
'tinymce_highlight' => 'mce-active',
|
||||
'submit_css' => '#crayon-te-ok',
|
||||
'cancel_css' => '#crayon-te-cancel',
|
||||
'content_css' => '#crayon-te-content',
|
||||
'dialog_title_css' => '#crayon-te-title',
|
||||
'submit_wrapper_css' => '#crayon-te-submit-wrapper',
|
||||
'data_value' => 'data-value',
|
||||
'attr_sep' => CrayonGlobalSettings::val_str(CrayonSettings::ATTR_SEP),
|
||||
'css_sep' => '_',
|
||||
'fallback_lang' => CrayonGlobalSettings::val(CrayonSettings::FALLBACK_LANG),
|
||||
'add_text' => CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_ADD_BUTTON_TEXT),
|
||||
'edit_text' => CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_EDIT_BUTTON_TEXT),
|
||||
'quicktag_text' => CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_QUICKTAG_BUTTON_TEXT),
|
||||
'submit_add' => crayon__('Add'),
|
||||
'submit_edit' => crayon__('Save'),
|
||||
'bar' => '#crayon-te-bar',
|
||||
'bar_content' => '#crayon-te-bar-content',
|
||||
'extensions' => CrayonResources::langs()->extensions_inverted()
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
public static function enqueue_resources() {
|
||||
global $CRAYON_VERSION;
|
||||
self::init_settings();
|
||||
|
||||
if (CRAYON_MINIFY) {
|
||||
wp_deregister_script('crayon_js');
|
||||
wp_enqueue_script('crayon_js', plugins_url(CRAYON_JS_TE_MIN, dirname(dirname(__FILE__))), array('jquery', 'quicktags'), $CRAYON_VERSION);
|
||||
CrayonSettingsWP::init_js_settings();
|
||||
wp_localize_script('crayon_js', 'CrayonTagEditorSettings', self::$settings);
|
||||
} else {
|
||||
wp_enqueue_script('crayon_colorbox_js', plugins_url(CRAYON_COLORBOX_JS, __FILE__), array('jquery'), $CRAYON_VERSION);
|
||||
wp_enqueue_style('crayon_colorbox_css', plugins_url(CRAYON_COLORBOX_CSS, __FILE__), array(), $CRAYON_VERSION);
|
||||
wp_enqueue_script('crayon_te_js', plugins_url(CRAYON_TAG_EDITOR_JS, __FILE__), array('crayon_util_js', 'crayon_colorbox_js'), $CRAYON_VERSION);
|
||||
wp_enqueue_script('crayon_qt_js', plugins_url(CRAYON_QUICKTAGS_JS, __FILE__), array('quicktags', 'crayon_te_js'), $CRAYON_VERSION, TRUE);
|
||||
wp_localize_script('crayon_te_js', 'CrayonTagEditorSettings', self::$settings);
|
||||
CrayonSettingsWP::other_scripts();
|
||||
}
|
||||
}
|
||||
|
||||
public static function init_tinymce($init) {
|
||||
if (!array_key_exists('extended_valid_elements', $init)) {
|
||||
$init['extended_valid_elements'] = '';
|
||||
}
|
||||
$init['extended_valid_elements'] .= ',pre[*],code[*],iframe[*]';
|
||||
return $init;
|
||||
}
|
||||
|
||||
public static function addbuttons() {
|
||||
// Add only in Rich Editor mode
|
||||
add_filter('mce_external_plugins', 'CrayonTagEditorWP::add_plugin');
|
||||
add_filter('mce_buttons', 'CrayonTagEditorWP::register_buttons');
|
||||
add_filter('bbp_before_get_the_content_parse_args', 'CrayonTagEditorWP::bbp_get_the_content_args');
|
||||
}
|
||||
|
||||
public static function bbp_get_the_content_args($args) {
|
||||
// Turn off "teeny" to allow the bbPress TinyMCE to display external plugins
|
||||
return array_merge($args, array('teeny' => false));
|
||||
}
|
||||
|
||||
public static function register_buttons($buttons) {
|
||||
array_push($buttons, 'separator', 'crayon_tinymce');
|
||||
return $buttons;
|
||||
}
|
||||
|
||||
public static function add_plugin($plugin_array) {
|
||||
$plugin_array['crayon_tinymce'] = plugins_url(CRAYON_TINYMCE_JS, __FILE__);
|
||||
return $plugin_array;
|
||||
}
|
||||
|
||||
// The remaining functions are for displayed output.
|
||||
|
||||
public static function select_resource($id, $resources, $current, $set_class = TRUE) {
|
||||
$id = CrayonSettings::PREFIX . $id;
|
||||
if (count($resources) > 0) {
|
||||
$class = $set_class ? 'class="' . CrayonSettings::SETTING . ' ' . CrayonSettings::SETTING_SPECIAL . '"' : '';
|
||||
echo '<select id="' . $id . '" name="' . $id . '" ' . $class . ' ' . CrayonSettings::SETTING_ORIG_VALUE . '="' . $current . '">';
|
||||
foreach ($resources as $resource) {
|
||||
$asterisk = $current == $resource->id() ? ' *' : '';
|
||||
echo '<option value="' . $resource->id() . '" ' . selected($current, $resource->id()) . ' >' . $resource->name() . $asterisk . '</option>';
|
||||
}
|
||||
echo '</select>';
|
||||
} else {
|
||||
// None found, default to text box
|
||||
echo '<input type="text" id="' . $id . '" name="' . $id . '" class="' . CrayonSettings::SETTING . ' ' . CrayonSettings::SETTING_SPECIAL . '" />';
|
||||
}
|
||||
}
|
||||
|
||||
public static function checkbox($id) {
|
||||
$id = CrayonSettings::PREFIX . $id;
|
||||
echo '<input type="checkbox" id="' . $id . '" name="' . $id . '" class="' . CrayonSettings::SETTING . ' ' . CrayonSettings::SETTING_SPECIAL . '" />';
|
||||
}
|
||||
|
||||
public static function textbox($id, $atts = array(), $set_class = TRUE) {
|
||||
$id = CrayonSettings::PREFIX . $id;
|
||||
$atts_str = '';
|
||||
$class = $set_class ? 'class="' . CrayonSettings::SETTING . ' ' . CrayonSettings::SETTING_SPECIAL . '"' : '';
|
||||
foreach ($atts as $k => $v) {
|
||||
$atts_str = $k . '="' . $v . '" ';
|
||||
}
|
||||
echo '<input type="text" id="' . $id . '" name="' . $id . '" ' . $class . ' ' . $atts_str . ' />';
|
||||
}
|
||||
|
||||
public static function submit() {
|
||||
?>
|
||||
<input type="button"
|
||||
class="button-primary <?php echo CrayonTagEditorWP::$settings['submit_css']; ?>"
|
||||
value="<?php echo CrayonTagEditorWP::$settings['submit_add']; ?>"
|
||||
name="submit"/>
|
||||
<?php
|
||||
}
|
||||
|
||||
public static function content() {
|
||||
CrayonSettingsWP::load_settings();
|
||||
$langs = CrayonLangs::sort_by_name(CrayonParser::parse_all());
|
||||
$curr_lang = CrayonGlobalSettings::val(CrayonSettings::FALLBACK_LANG);
|
||||
$themes = CrayonResources::themes()->get();
|
||||
$curr_theme = CrayonGlobalSettings::val(CrayonSettings::THEME);
|
||||
$fonts = CrayonResources::fonts()->get();
|
||||
$curr_font = CrayonGlobalSettings::val(CrayonSettings::FONT);
|
||||
CrayonTagEditorWP::init_settings();
|
||||
|
||||
?>
|
||||
|
||||
<div id="crayon-te-content" class="crayon-te">
|
||||
<div id="crayon-te-bar">
|
||||
<div id="crayon-te-bar-content">
|
||||
<div id="crayon-te-title">Title</div>
|
||||
<div id="crayon-te-controls">
|
||||
<a id="crayon-te-ok" href="#"><?php crayon_e('OK'); ?></a> <span
|
||||
class="crayon-te-seperator">|</span> <a id="crayon-te-cancel"
|
||||
href="#"><?php crayon_e('Cancel'); ?></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table id="crayon-te-table" class="describe">
|
||||
<tr class="crayon-tr-center">
|
||||
<th><?php crayon_e('Title'); ?>
|
||||
</th>
|
||||
<td class="crayon-nowrap"><?php self::textbox('title', array('placeholder' => crayon__('A short description'))); ?>
|
||||
<span id="crayon-te-sub-section"> <?php self::checkbox('inline'); ?>
|
||||
<span class="crayon-te-section"><?php crayon_e('Inline'); ?> </span>
|
||||
</span> <span id="crayon-te-sub-section"> <?php self::checkbox('highlight'); ?>
|
||||
<span class="crayon-te-section"><?php crayon_e("Don't Highlight"); ?>
|
||||
</span>
|
||||
</span></td>
|
||||
</tr>
|
||||
<tr class="crayon-tr-center">
|
||||
<th><?php crayon_e('Language'); ?>
|
||||
</th>
|
||||
<td class="crayon-nowrap"><?php self::select_resource('lang', $langs, $curr_lang); ?>
|
||||
<span class="crayon-te-section"><?php crayon_e('Line Range'); ?> </span>
|
||||
<?php self::textbox('range', array('placeholder' => crayon__('(e.g. 3-5 or 3)'))); ?>
|
||||
<span class="crayon-te-section"><?php crayon_e('Marked Lines'); ?> </span>
|
||||
<?php self::textbox('mark', array('placeholder' => crayon__('(e.g. 1,2,3-5)'))); ?>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="crayon-tr-center" style="text-align: center;">
|
||||
<th>
|
||||
<div>
|
||||
<?php crayon_e('Code'); ?>
|
||||
</div>
|
||||
<input type="button" id="crayon-te-clear"
|
||||
class="secondary-primary" value="<?php crayon_e('Clear'); ?>"
|
||||
name="clear"/>
|
||||
</th>
|
||||
<td><textarea id="crayon-code" name="code"
|
||||
placeholder="<?php crayon_e('Paste your code here, or type it in manually.'); ?>"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="crayon-tr-center">
|
||||
<th id="crayon-url-th"><?php crayon_e('URL'); ?>
|
||||
</th>
|
||||
<td><?php self::textbox('url', array('placeholder' => crayon__('Relative local path or absolute URL'))); ?>
|
||||
<div id="crayon-te-url-info" class="crayon-te-info">
|
||||
<?php
|
||||
crayon_e("If the URL fails to load, the code above will be shown instead. If no code exists, an error is shown.");
|
||||
echo ' ';
|
||||
printf(crayon__('If a relative local path is given it will be appended to %s - which is defined in %sCrayon > Settings > Files%s.'), '<span class="crayon-te-quote">' . get_home_url() . '/' . CrayonGlobalSettings::val(CrayonSettings::LOCAL_PATH) . '</span>', '<a href="options-general.php?page=crayon_settings" target="_blank">', '</a>');
|
||||
?>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="crayon-te-submit-wrapper" colspan="2"
|
||||
style="text-align: center;"><?php self::submit(); ?></td>
|
||||
</tr>
|
||||
<!-- <tr>-->
|
||||
<!-- <td colspan="2"><div id="crayon-te-warning" class="updated crayon-te-info"></div></td>-->
|
||||
<!-- </tr>-->
|
||||
<tr>
|
||||
<td colspan="2"><?php
|
||||
$admin = isset($_GET['is_admin']) ? intval($_GET['is_admin']) : is_admin();
|
||||
if (!$admin && !CrayonGlobalSettings::val(CrayonSettings::TAG_EDITOR_SETTINGS)) {
|
||||
exit();
|
||||
}
|
||||
?>
|
||||
<hr/>
|
||||
<div>
|
||||
<h2 class="crayon-te-heading">
|
||||
<?php crayon_e('Settings'); ?>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="crayon-te-settings-info" class="crayon-te-info">
|
||||
<?php
|
||||
crayon_e('Change the following settings to override their global values.');
|
||||
echo ' <span class="', CrayonSettings::SETTING_CHANGED, '">';
|
||||
crayon_e('Only changes (shown yellow) are applied.');
|
||||
echo '</span><br/>';
|
||||
echo sprintf(crayon__('Future changes to the global settings under %sCrayon > Settings%s won\'t affect overridden settings.'), '<a href="options-general.php?page=crayon_settings" target="_blank">', '</a>');
|
||||
?>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php
|
||||
$sections = array('Theme', 'Font', 'Metrics', 'Toolbar', 'Lines', 'Code');
|
||||
foreach ($sections as $section) {
|
||||
echo '<tr><th>', crayon__($section), '</th><td>';
|
||||
call_user_func('CrayonSettingsWP::' . strtolower($section), TRUE);
|
||||
echo '</td></tr>';
|
||||
}
|
||||
?>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
exit();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if (defined('ABSPATH')) {
|
||||
add_action('init', 'CrayonTagEditorWP::init');
|
||||
}
|
||||
|
||||
?>
|
||||
32
util/tag-editor/crayon_te.css
Normal file
32
util/tag-editor/crayon_te.css
Normal file
@ -0,0 +1,32 @@
|
||||
pre {
|
||||
background: #F4F4F4 !important;
|
||||
border: 1px solid #CCC !important;
|
||||
margin-bottom: 1.5em !important;
|
||||
padding: 0.3em 0.5em !important;
|
||||
min-height: 1.5em;
|
||||
}
|
||||
|
||||
pre.crayon-selected {
|
||||
background: #cce4f5 !important;
|
||||
border: 1px solid #9dc8e6 !important;
|
||||
}
|
||||
|
||||
pre, span.crayon-inline {
|
||||
font-family: "Courier 10 Pitch", Courier, monospace !important;
|
||||
font-size: 80% !important;
|
||||
}
|
||||
|
||||
span.crayon-inline {
|
||||
background: #F4F4F4 !important;
|
||||
border: 1px solid #CCC !important;
|
||||
padding: 2px 3px;
|
||||
|
||||
/* font: 80% !important; */
|
||||
/* margin-bottom: 1.5em !important; */
|
||||
/* padding: 0.3em 0.5em !important; */
|
||||
}
|
||||
|
||||
span.crayon-inline.crayon-selected {
|
||||
background: #d2eeca !important;
|
||||
border: 1px solid #b8dc9b !important;
|
||||
}
|
||||
270
util/tag-editor/crayon_tinymce.js
Normal file
270
util/tag-editor/crayon_tinymce.js
Normal file
@ -0,0 +1,270 @@
|
||||
(function ($) {
|
||||
|
||||
window.CrayonTinyMCE = new function () {
|
||||
|
||||
// TinyMCE specific
|
||||
var name = 'crayon_tinymce';
|
||||
var s, te = null;
|
||||
var isHighlighted = false;
|
||||
var currPre = null;
|
||||
var isInit = false;
|
||||
// Switch events
|
||||
var switch_html_click = switch_tmce_click = null;
|
||||
|
||||
var base = this;
|
||||
// var wasHighlighted = false;
|
||||
|
||||
base.setHighlight = function (highlight) {
|
||||
$(s.tinymce_button).closest(s.tinymce_button_generic).toggleClass(s.tinymce_highlight, highlight);
|
||||
isHighlighted = highlight;
|
||||
};
|
||||
|
||||
base.selectPreCSS = function (selected) {
|
||||
if (currPre) {
|
||||
if (selected) {
|
||||
$(currPre).addClass(s.css_selected);
|
||||
} else {
|
||||
$(currPre).removeClass(s.css_selected);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
base.isPreSelectedCSS = function () {
|
||||
if (currPre) {
|
||||
return $(currPre).hasClass(s.css_selected);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
base.loadTinyMCE = function () {
|
||||
var version = parseInt(tinymce.majorVersion);
|
||||
if (!isNaN(version) && version <= 3) {
|
||||
return this._loadTinyMCEv3();
|
||||
}
|
||||
|
||||
s = CrayonTagEditorSettings;
|
||||
te = CrayonTagEditor;
|
||||
|
||||
// TODO(aramk) find the TinyMCE version 4 compliant command for this.
|
||||
//tinymce.PluginManager.requireLangPack(name);
|
||||
|
||||
tinymce.PluginManager.add(name, function (ed, url) {
|
||||
// TODO(aramk) This is called twice for some reason.
|
||||
ed.on('init', function () {
|
||||
ed.dom.loadCSS(url + '/crayon_te.css');
|
||||
if (isInit) {
|
||||
return;
|
||||
}
|
||||
$(s.tinymce_button).parent().addClass(s.tinymce_button_unique);
|
||||
CrayonTagEditor.bind('.' + s.tinymce_button_unique);
|
||||
// Remove all selected pre tags
|
||||
$('.' + s.css_selected, ed.getContent()).removeClass(s.css_selected);
|
||||
isInit = true;
|
||||
});
|
||||
|
||||
// Prevent <p> on enter, turn into \n
|
||||
ed.on('keyDown', function (e) {
|
||||
var selection = ed.selection;
|
||||
if (e.keyCode == 13) {
|
||||
var node = selection.getNode();
|
||||
if (node.nodeName == 'PRE') {
|
||||
selection.setContent('\n', {format: 'raw'});
|
||||
return tinymce.dom.Event.cancel(e);
|
||||
} else if (te.isCrayon(node)) {
|
||||
// Only triggers for inline <span>, ignore enter in inline
|
||||
return tinymce.dom.Event.cancel(e);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Remove onclick and call ourselves
|
||||
var switch_html = $(s.switch_html);
|
||||
switch_html.prop('onclick', null);
|
||||
switch_html.click(function () {
|
||||
// Remove selected pre class when switching to HTML editor
|
||||
base.selectPreCSS(false);
|
||||
switchEditors.go('content', 'html');
|
||||
});
|
||||
|
||||
// Highlight selected
|
||||
ed.on('nodeChange', function (event) {
|
||||
var n = event.element;
|
||||
if (n != currPre) {
|
||||
// We only care if we select another same object
|
||||
if (currPre) {
|
||||
// If we have a previous pre, remove it
|
||||
base.selectPreCSS(false);
|
||||
currPre = null;
|
||||
}
|
||||
if (te.isCrayon(n)) {
|
||||
// Add new pre
|
||||
currPre = n;
|
||||
base.selectPreCSS(true);
|
||||
base.setHighlight(true);
|
||||
} else {
|
||||
// No pre selected
|
||||
base.setHighlight(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
ed.addButton(name, {
|
||||
// TODO add translation
|
||||
title: s.dialog_title_add,
|
||||
onclick: function () {
|
||||
te.showDialog({
|
||||
insert: function (shortcode) {
|
||||
ed.execCommand('mceInsertContent', 0, shortcode);
|
||||
},
|
||||
edit: function (shortcode) {
|
||||
// This will change the currPre object
|
||||
var newPre = $(shortcode);
|
||||
$(currPre).replaceWith(newPre);
|
||||
// XXX DOM element not jQuery
|
||||
currPre = newPre[0];
|
||||
},
|
||||
select: function () {
|
||||
return ed.selection.getContent({format: 'text'});
|
||||
},
|
||||
editor_str: 'tinymce',
|
||||
ed: ed,
|
||||
node: currPre,
|
||||
input: 'decode',
|
||||
output: 'encode'
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
// TinyMCE v3 - deprecated.
|
||||
base._loadTinyMCEv3 = function () {
|
||||
s = CrayonTagEditorSettings;
|
||||
te = CrayonTagEditor;
|
||||
|
||||
tinymce.PluginManager.requireLangPack(name);
|
||||
|
||||
tinymce.create('tinymce.plugins.Crayon', {
|
||||
init: function (ed, url) {
|
||||
|
||||
ed.onInit.add(function (ed) {
|
||||
ed.dom.loadCSS(url + '/crayon_te.css');
|
||||
});
|
||||
|
||||
// Prevent <p> on enter, turn into \n
|
||||
ed.onKeyDown.add(function (ed, e) {
|
||||
var selection = ed.selection;
|
||||
if (e.keyCode == 13) {
|
||||
var node = selection.getNode();
|
||||
if (node.nodeName == 'PRE') {
|
||||
selection.setContent('\n', {format: 'raw'});
|
||||
return tinymce.dom.Event.cancel(e);
|
||||
} else if (te.isCrayon(node)) {
|
||||
// Only triggers for inline <span>, ignore enter in inline
|
||||
return tinymce.dom.Event.cancel(e);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
ed.onInit.add(function (ed) {
|
||||
CrayonTagEditor.bind(s.tinymce_button);
|
||||
});
|
||||
|
||||
ed.addCommand('showCrayon', function () {
|
||||
te.showDialog({
|
||||
insert: function (shortcode) {
|
||||
ed.execCommand('mceInsertContent', 0, shortcode);
|
||||
},
|
||||
edit: function (shortcode) {
|
||||
// This will change the currPre object
|
||||
var newPre = $(shortcode);
|
||||
$(currPre).replaceWith(newPre);
|
||||
// XXX DOM element not jQuery
|
||||
currPre = newPre[0];
|
||||
},
|
||||
select: function () {
|
||||
return ed.selection.getContent({format: 'text'});
|
||||
},
|
||||
editor_str: 'tinymce',
|
||||
ed: ed,
|
||||
node: currPre,
|
||||
input: 'decode',
|
||||
output: 'encode'
|
||||
});
|
||||
});
|
||||
|
||||
// Remove onclick and call ourselves
|
||||
var switch_html = $(s.switch_html);
|
||||
switch_html.prop('onclick', null);
|
||||
switch_html.click(function () {
|
||||
// Remove selected pre class when switching to HTML editor
|
||||
base.selectPreCSS(false);
|
||||
switchEditors.go('content', 'html');
|
||||
});
|
||||
|
||||
// Highlight selected
|
||||
ed.onNodeChange.add(function (ed, cm, n, co) {
|
||||
if (n != currPre) {
|
||||
// We only care if we select another same object
|
||||
if (currPre) {
|
||||
// If we have a previous pre, remove it
|
||||
base.selectPreCSS(false);
|
||||
currPre = null;
|
||||
}
|
||||
if (te.isCrayon(n)) {
|
||||
// Add new pre
|
||||
currPre = n;
|
||||
base.selectPreCSS(true);
|
||||
base.setHighlight(true);
|
||||
} else {
|
||||
// No pre selected
|
||||
base.setHighlight(false);
|
||||
}
|
||||
// var tooltip = currPre ? s.dialog_title_edit : s.dialog_title_add;
|
||||
// $(s.tinymce_button).attr('title', tooltip);
|
||||
}
|
||||
});
|
||||
|
||||
ed.onBeforeSetContent.add(function (ed, o) {
|
||||
// Remove all selected pre tags
|
||||
var content = $(o.content);
|
||||
var wrapper = $('<div>');
|
||||
content.each(function () {
|
||||
$(this).removeClass(s.css_selected);
|
||||
wrapper.append($(this).clone());
|
||||
});
|
||||
o.content = wrapper.html();
|
||||
});
|
||||
|
||||
ed.addButton(name, {
|
||||
// TODO add translation
|
||||
title: s.dialog_title,
|
||||
cmd: 'showCrayon'
|
||||
});
|
||||
},
|
||||
createControl: function (n, cm) {
|
||||
return null;
|
||||
},
|
||||
getInfo: function () {
|
||||
return {
|
||||
longname: 'Crayon Syntax Highlighter',
|
||||
author: 'Aram Kocharyan',
|
||||
authorurl: 'http://aramk.com/',
|
||||
infourl: 'https://github.com/aramk/crayon-syntax-highlighter',
|
||||
version: "1.0"
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
tinymce.PluginManager.add(name, tinymce.plugins.Crayon);
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
$(document).ready(function () {
|
||||
// Load TinyMCE
|
||||
CrayonTinyMCE.loadTinyMCE();
|
||||
});
|
||||
|
||||
})(jQueryCrayon);
|
||||
Reference in New Issue
Block a user