Korbs/Squire
0
Fork 0
mirror of https://github.com/fastmail/Squire.git synced 2025-01-03 13:16:31 -05:00
Code Issues Activity

override default properties by config

Browse source
This commit is contained in:
crossjs 2015-05-05 18:45:32 +08:00
parent 11ff577168
commit 22408056bb
4 changed files with 69 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
Demo.html
View file

@ -52,19 +52,19 @@
<span id="makeLink" class="prompt">Link</span> <span id="makeLink" class="prompt">Link</span>
</p> </p>
<p> <p>
<span id="increaseQuoteLevel">Quote</span> <span id="increaseQuoteLevel">Quote</span>
<span id="decreaseQuoteLevel">Dequote</span> <span id="decreaseQuoteLevel">Dequote</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span id="makeUnorderedList">List</span> <span id="makeUnorderedList">List</span>
<span id="removeList">Unlist</span> <span id="removeList">Unlist</span>
<span id="increaseListLevel">Increase list level</span> <span id="increaseListLevel">Increase list level</span>
<span id="decreaseListLevel">Decrease list level</span> <span id="decreaseListLevel">Decrease list level</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span id="insertImage" class="prompt">Insert image</span> <span id="insertImage" class="prompt" value="https://pbs.twimg.com/profile_images/508277159681478656/hC9WIBpC_normal.jpeg">Insert image</span>
<span id="setHTML" class="prompt">Set HTML</span> <span id="setHTML" class="prompt">Set HTML</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span id="undo">Undo</span> <span id="undo">Undo</span>
<span id="redo">Redo</span> <span id="redo">Redo</span>
</p> </p>
</header> </header>
<script type="text/template" id="editorStyles"> <script type="text/template" id="editorStyles">
@ -112,28 +112,50 @@
</script> </script>
<script type="text/javascript" src="build/squire-raw.js"></script> <script type="text/javascript" src="build/squire-raw.js"></script>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
var Squire = window.Squire;
var editor; var editor;
var iframe = document.createElement( 'iframe' ); var iframe = document.createElement( 'iframe' );
iframe.addEventListener( 'load', function () { iframe.addEventListener( 'load', function () {
// Make sure we're in standards mode. // Make sure we're in standards mode.
var doc = iframe.contentDocument; var doc = iframe.contentDocument;
if ( doc.compatMode !== 'CSS1Compat' ) { if ( doc.compatMode !== 'CSS1Compat' ) {
doc.open(); doc.open();
doc.write( '<!DOCTYPE html><title></title>' ); doc.write( '<!DOCTYPE html><title></title>' );
doc.close(); doc.close();
} }
// doc.close() can cause a re-entrant load event in some browsers, // doc.close() can cause a re-entrant load event in some browsers,
// such as IE9. // such as IE9.
if ( editor ) { if ( editor ) {
return; return;
} }
// Create Squire instance // Create Squire instance
editor = new Squire( doc ); editor = new Squire( doc, {
defaultBlockTag: 'P'
} );
// Add styles to frame // Add styles to frame
var style = doc.createElement( 'style' ); var style = doc.createElement( 'style' );
style.type = 'text/css'; style.type = 'text/css';
style.textContent = document.getElementById( 'editorStyles' ).textContent; style.textContent = document.getElementById( 'editorStyles' ).textContent;
doc.querySelector( 'head' ).appendChild( style ); doc.querySelector( 'head' ).appendChild( style );
// plugins
editor.addEventListener('mousedown', function(e) {
if (e.target.nodeName === 'IMG') {
this.selectNode(e.target);
}
});
editor.addEventListener('select', function(e) {
console.log(this.getSelectedNode() || this.getSelectedText());
});
editor.addEventListener('mouseup', function(e) {
console.log(this.getPath(),
this.getSelectedNode(),
this.getSelectedText());
});
}, false ); }, false );
document.body.appendChild( iframe ); document.body.appendChild( iframe );
@ -143,7 +165,7 @@
value; value;
if ( id && editor && editor[ id ] ) { if ( id && editor && editor[ id ] ) {
if ( e.target.className === 'prompt' ) { if ( e.target.className === 'prompt' ) {
value = prompt( 'Value:' ); value = prompt( 'Value:', e.target.getAttribute('value') );
} }
editor[ id ]( value ); editor[ id ]( value );
} }

16
build/squire-raw.js
View file

@ -1438,7 +1438,7 @@ function getSquireInstance ( doc ) {
return null; return null;
} }
function Squire ( doc ) { function Squire ( doc, config ) {
var win = doc.defaultView; var win = doc.defaultView;
var body = doc.body; var body = doc.body;
var mutation; var mutation;
@ -1504,6 +1504,9 @@ function Squire ( doc ) {
// Add key handlers // Add key handlers
this._keyHandlers = Object.create( keyHandlers ); this._keyHandlers = Object.create( keyHandlers );
// initialize custom configurations
this.initConfig( config );
// Fix IE<10's buggy implementation of Text#splitText. // Fix IE<10's buggy implementation of Text#splitText.
// If the split is at the end of the node, it doesn't insert the newly split // If the split is at the end of the node, it doesn't insert the newly split
// node into the document, and sets its value to undefined rather than ''. // node into the document, and sets its value to undefined rather than ''.
@ -1543,11 +1546,22 @@ function Squire ( doc ) {
instances.push( this ); instances.push( this );
// for fixCursor would query instance by node.ownerDocument first
// we must initialize HTML after instance save
this.setHTML( '' ); this.setHTML( '' );
} }
var proto = Squire.prototype; var proto = Squire.prototype;
proto.initConfig = function ( config ) {
if (config) {
var that = this;
Object.keys(config).forEach(function(key) {
that[key] = config[key];
});
}
};
proto.createElement = function ( tag, props, children ) { proto.createElement = function ( tag, props, children ) {
return createElement( this._doc, tag, props, children ); return createElement( this._doc, tag, props, children );
}; };

4
build/squire.js
View file

File diff suppressed because one or more lines are too long

16
source/Editor.js
View file

@ -14,7 +14,7 @@ function getSquireInstance ( doc ) {
return null; return null;
} }
function Squire ( doc ) { function Squire ( doc, config ) {
var win = doc.defaultView; var win = doc.defaultView;
var body = doc.body; var body = doc.body;
var mutation; var mutation;
@ -80,6 +80,9 @@ function Squire ( doc ) {
// Add key handlers // Add key handlers
this._keyHandlers = Object.create( keyHandlers ); this._keyHandlers = Object.create( keyHandlers );
// initialize custom configurations
this.initConfig( config );
// Fix IE<10's buggy implementation of Text#splitText. // Fix IE<10's buggy implementation of Text#splitText.
// If the split is at the end of the node, it doesn't insert the newly split // If the split is at the end of the node, it doesn't insert the newly split
// node into the document, and sets its value to undefined rather than ''. // node into the document, and sets its value to undefined rather than ''.
@ -119,11 +122,22 @@ function Squire ( doc ) {
instances.push( this ); instances.push( this );
// for fixCursor would query instance by node.ownerDocument first
// we must initialize HTML after instance save
this.setHTML( '' ); this.setHTML( '' );
} }
var proto = Squire.prototype; var proto = Squire.prototype;
proto.initConfig = function ( config ) {
if (config) {
var that = this;
Object.keys(config).forEach(function(key) {
that[key] = config[key];
});
}
};
proto.createElement = function ( tag, props, children ) { proto.createElement = function ( tag, props, children ) {
return createElement( this._doc, tag, props, children ); return createElement( this._doc, tag, props, children );
}; };