<\/div>| )*$/, "" );
};
Wysiwyg.prototype.updateToolbar = function( editor, toolbarBtnSelector, options ) {
if ( options.activeToolbarClass ) {
$( options.toolbarSelector ).find( toolbarBtnSelector ).each( function() {
var self = $( this );
var commandArr = self.data( options.commandRole ).split( " " );
var command = commandArr[ 0 ];
// If the command has an argument and its value matches this button. == used for string/number comparison
if ( commandArr.length > 1 && document.queryCommandEnabled( command ) && document.queryCommandValue( command ) === commandArr[ 1 ] ) {
self.addClass( options.activeToolbarClass );
}
// Else if the command has no arguments and it is active
else if ( commandArr.length === 1 && document.queryCommandEnabled( command ) && document.queryCommandState( command ) ) {
self.addClass( options.activeToolbarClass );
}
// Else the command is not active
else {
self.removeClass( options.activeToolbarClass );
}
} );
}
};
Wysiwyg.prototype.execCommand = function( commandWithArgs, valueArg, editor, options, toolbarBtnSelector ) {
var commandArr = commandWithArgs.split( " " ),
command = commandArr.shift(),
args = commandArr.join( " " ) + ( valueArg || "" );
var parts = commandWithArgs.split( "-" );
if ( parts.length === 1 ) {
document.execCommand( command, false, args );
} else if ( parts[ 0 ] === "format" && parts.length === 2 ) {
document.execCommand( "formatBlock", false, parts[ 1 ] );
}
( editor ).trigger( "change" );
this.updateToolbar( editor, toolbarBtnSelector, options );
};
Wysiwyg.prototype.bindHotkeys = function( editor, options, toolbarBtnSelector ) {
var self = this;
$.each( options.hotKeys, function( hotkey, command ) {
if(!command) return;
$( editor ).keydown( hotkey, function( e ) {
if ( editor.attr( "contenteditable" ) && $( editor ).is( ":visible" ) ) {
e.preventDefault();
e.stopPropagation();
self.execCommand( command, null, editor, options, toolbarBtnSelector );
}
} ).keyup( hotkey, function( e ) {
if ( editor.attr( "contenteditable" ) && $( editor ).is( ":visible" ) ) {
e.preventDefault();
e.stopPropagation();
}
} );
} );
editor.keyup( function() { editor.trigger( "change" ); } );
};
Wysiwyg.prototype.getCurrentRange = function() {
var sel, range;
if ( window.getSelection ) {
sel = window.getSelection();
if ( sel.getRangeAt && sel.rangeCount ) {
range = sel.getRangeAt( 0 );
}
} else if ( document.selection ) {
range = document.selection.createRange();
}
return range;
};
Wysiwyg.prototype.saveSelection = function() {
this.selectedRange = this.getCurrentRange();
};
Wysiwyg.prototype.restoreSelection = function() {
var selection;
if ( window.getSelection || document.createRange ) {
selection = window.getSelection();
if ( this.selectedRange ) {
try {
selection.removeAllRanges();
}
catch ( ex ) {
document.body.createTextRange().select();
document.selection.empty();
}
selection.addRange( this.selectedRange );
}
} else if ( document.selection && this.selectedRange ) {
this.selectedRange.select();
}
};
// Adding Toggle HTML based on the work by @jd0000, but cleaned up a little to work in this context.
Wysiwyg.prototype.toggleHtmlEdit = function( editor ) {
if ( editor.data( "wysiwyg-html-mode" ) !== true ) {
var oContent = editor.html();
var editorPre = $( "
" );
$( editorPre ).append( document.createTextNode( oContent ) );
$( editorPre ).attr( "contenteditable", true );
$( editor ).html( " " );
$( editor ).append( $( editorPre ) );
$( editor ).attr( "contenteditable", false );
$( editor ).data( "wysiwyg-html-mode", true );
$( editorPre ).focus();
} else {
$( editor ).html( $( editor ).text() );
$( editor ).attr( "contenteditable", true );
$( editor ).data( "wysiwyg-html-mode", false );
$( editor ).focus();
}
};
Wysiwyg.prototype.insertFiles = function( files, options, editor, toolbarBtnSelector ) {
var self = this;
editor.focus();
$.each( files, function( idx, fileInfo ) {
if ( /^image\//.test( fileInfo.type ) ) {
$.when( self.readFileIntoDataUrl( fileInfo ) ).done( function( dataUrl ) {
self.execCommand( "insertimage", dataUrl, editor, options, toolbarBtnSelector );
editor.trigger( "image-inserted" );
} ).fail( function( e ) {
options.fileUploadError( "file-reader", e );
} );
} else {
options.fileUploadError( "unsupported-file-type", fileInfo.type );
}
} );
};
Wysiwyg.prototype.markSelection = function( input, color, options ) {
this.restoreSelection( );
if ( document.queryCommandSupported( "hiliteColor" ) ) {
document.execCommand( "hiliteColor", false, color || "transparent" );
}
this.saveSelection( );
input.data( options.selectionMarker, color );
};
Wysiwyg.prototype.bindToolbar = function( editor, toolbar, options, toolbarBtnSelector ) {
var self = this;
toolbar.find( toolbarBtnSelector ).click( function() {
self.restoreSelection( );
editor.focus();
if ( editor.data( options.commandRole ) === "html" ) {
self.toggleHtmlEdit( editor );
} else {
self.execCommand( $( this ).data( options.commandRole ), null, editor, options, toolbarBtnSelector );
}
self.saveSelection( );
} );
toolbar.find( "[data-toggle=dropdown]" ).click( this.restoreSelection( ) );
toolbar.find( "input[type=text][data-" + options.commandRole + "]" ).on( "webkitspeechchange change", function() {
var newValue = this.value; // Ugly but prevents fake double-calls due to selection restoration
this.value = "";
self.restoreSelection( );
if ( newValue ) {
editor.focus();
self.execCommand( $( this ).data( options.commandRole ), newValue, editor, options, toolbarBtnSelector );
}
self.saveSelection( );
} ).on( "focus", function() {
var input = $( this );
if ( !input.data( options.selectionMarker ) ) {
self.markSelection( input, options.selectionColor, options );
input.focus();
}
} ).on( "blur", function() {
var input = $( this );
if ( input.data( options.selectionMarker ) ) {
self.markSelection( input, false, options );
}
} );
toolbar.find( "input[type=file][data-" + options.commandRole + "]" ).change( function() {
self.restoreSelection( );
if ( this.type === "file" && this.files && this.files.length > 0 ) {
self.insertFiles( this.files, options, editor, toolbarBtnSelector );
}
self.saveSelection( );
this.value = "";
} );
};
Wysiwyg.prototype.initFileDrops = function( editor, options, toolbarBtnSelector ) {
var self = this;
editor.on( "dragenter dragover", false ).on( "drop", function( e ) {
var dataTransfer = e.originalEvent.dataTransfer;
e.stopPropagation();
e.preventDefault();
if ( dataTransfer && dataTransfer.files && dataTransfer.files.length > 0 ) {
self.insertFiles( dataTransfer.files, options, editor, toolbarBtnSelector );
}
} );
};
/*
* Represenets an editor
* @constructor
* @param {object} userOptions - The default options selected by the user.
*/
$.fn.wysiwyg = function( userOptions ) {
var wysiwyg = new Wysiwyg( this, userOptions );
};
} )( window, window.jQuery );