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

Allow class names to be configured

Browse source
This commit is contained in:
Neil Jenkins 2018-07-12 13:35:20 +10:00
parent 7a24d6c505
commit f0594091c5
6 changed files with 114 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

104
build/squire-raw.js
View file

@ -17,11 +17,6 @@ var START_TO_END = 1; // Range.START_TO_END
var END_TO_END = 2; // Range.END_TO_END var END_TO_END = 2; // Range.END_TO_END
var END_TO_START = 3; // Range.END_TO_START var END_TO_START = 3; // Range.END_TO_START
var HIGHLIGHT_CLASS = 'highlight';
var COLOUR_CLASS = 'colour';
var FONT_FAMILY_CLASS = 'font';
var FONT_SIZE_CLASS = 'size';
var ZWS = '\u200B'; var ZWS = '\u200B';
var win = doc.defaultView; var win = doc.defaultView;
@ -309,11 +304,11 @@ function isOrContains ( parent, node ) {
return false; return false;
} }
function getPath ( node, root ) { function getPath ( node, root, config ) {
var path = ''; var path = '';
var id, className, classNames, dir; var id, className, classNames, dir, styleNames;
if ( node && node !== root ) { if ( node && node !== root ) {
path = getPath( node.parentNode, root ); path = getPath( node.parentNode, root, config );
if ( node.nodeType === ELEMENT_NODE ) { if ( node.nodeType === ELEMENT_NODE ) {
path += ( path ? '>' : '' ) + node.nodeName; path += ( path ? '>' : '' ) + node.nodeName;
if ( id = node.id ) { if ( id = node.id ) {
@ -329,19 +324,20 @@ function getPath ( node, root ) {
path += '[dir=' + dir + ']'; path += '[dir=' + dir + ']';
} }
if ( classNames ) { if ( classNames ) {
if ( indexOf.call( classNames, HIGHLIGHT_CLASS ) > -1 ) { styleNames = config.classNames;
if ( indexOf.call( classNames, styleNames.highlight ) > -1 ) {
path += '[backgroundColor=' + path += '[backgroundColor=' +
node.style.backgroundColor.replace( / /g,'' ) + ']'; node.style.backgroundColor.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, COLOUR_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.colour ) > -1 ) {
path += '[color=' + path += '[color=' +
node.style.color.replace( / /g,'' ) + ']'; node.style.color.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, FONT_FAMILY_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.fontFamily ) > -1 ) {
path += '[fontFamily=' + path += '[fontFamily=' +
node.style.fontFamily.replace( / /g,'' ) + ']'; node.style.fontFamily.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, FONT_SIZE_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.fontSize ) > -1 ) {
path += '[fontSize=' + node.style.fontSize + ']'; path += '[fontSize=' + node.style.fontSize + ']';
} }
} }
@ -1789,18 +1785,18 @@ var fontSizes = {
var styleToSemantic = { var styleToSemantic = {
backgroundColor: { backgroundColor: {
regexp: notWS, regexp: notWS,
replace: function ( doc, colour ) { replace: function ( doc, classNames, colour ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': HIGHLIGHT_CLASS, 'class': classNames.highlight,
style: 'background-color:' + colour style: 'background-color:' + colour
}); });
} }
}, },
color: { color: {
regexp: notWS, regexp: notWS,
replace: function ( doc, colour ) { replace: function ( doc, classNames, colour ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': COLOUR_CLASS, 'class': classNames.colour,
style: 'color:' + colour style: 'color:' + colour
}); });
} }
@ -1819,18 +1815,18 @@ var styleToSemantic = {
}, },
fontFamily: { fontFamily: {
regexp: notWS, regexp: notWS,
replace: function ( doc, family ) { replace: function ( doc, classNames, family ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': classNames.fontFamily,
style: 'font-family:' + family style: 'font-family:' + family
}); });
} }
}, },
fontSize: { fontSize: {
regexp: notWS, regexp: notWS,
replace: function ( doc, size ) { replace: function ( doc, classNames, size ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': FONT_SIZE_CLASS, 'class': classNames.fontSize,
style: 'font-size:' + size style: 'font-size:' + size
}); });
} }
@ -1852,7 +1848,7 @@ var replaceWithTag = function ( tag ) {
}; };
}; };
var replaceStyles = function ( node, parent ) { var replaceStyles = function ( node, parent, config ) {
var style = node.style; var style = node.style;
var doc = node.ownerDocument; var doc = node.ownerDocument;
var attr, converter, css, newTreeBottom, newTreeTop, el; var attr, converter, css, newTreeBottom, newTreeTop, el;
@ -1861,7 +1857,7 @@ var replaceStyles = function ( node, parent ) {
converter = styleToSemantic[ attr ]; converter = styleToSemantic[ attr ];
css = style[ attr ]; css = style[ attr ];
if ( css && converter.regexp.test( css ) ) { if ( css && converter.regexp.test( css ) ) {
el = converter.replace( doc, css ); el = converter.replace( doc, config.classNames, css );
if ( !newTreeTop ) { if ( !newTreeTop ) {
newTreeTop = el; newTreeTop = el;
} }
@ -1892,16 +1888,17 @@ var stylesRewriters = {
EM: replaceWithTag( 'I' ), EM: replaceWithTag( 'I' ),
INS: replaceWithTag( 'U' ), INS: replaceWithTag( 'U' ),
STRIKE: replaceWithTag( 'S' ), STRIKE: replaceWithTag( 'S' ),
FONT: function ( node, parent ) { FONT: function ( node, parent, config ) {
var face = node.face, var face = node.face;
size = node.size, var size = node.size;
colour = node.color, var colour = node.color;
doc = node.ownerDocument, var doc = node.ownerDocument;
fontSpan, sizeSpan, colourSpan, var classNames = config.classNames;
newTreeBottom, newTreeTop; var fontSpan, sizeSpan, colourSpan;
var newTreeBottom, newTreeTop;
if ( face ) { if ( face ) {
fontSpan = createElement( doc, 'SPAN', { fontSpan = createElement( doc, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': classNames.fontFamily,
style: 'font-family:' + face style: 'font-family:' + face
}); });
newTreeTop = fontSpan; newTreeTop = fontSpan;
@ -1909,7 +1906,7 @@ var stylesRewriters = {
} }
if ( size ) { if ( size ) {
sizeSpan = createElement( doc, 'SPAN', { sizeSpan = createElement( doc, 'SPAN', {
'class': FONT_SIZE_CLASS, 'class': classNames.fontSize,
style: 'font-size:' + fontSizes[ size ] + 'px' style: 'font-size:' + fontSizes[ size ] + 'px'
}); });
if ( !newTreeTop ) { if ( !newTreeTop ) {
@ -1925,7 +1922,7 @@ var stylesRewriters = {
colour = '#' + colour; colour = '#' + colour;
} }
colourSpan = createElement( doc, 'SPAN', { colourSpan = createElement( doc, 'SPAN', {
'class': COLOUR_CLASS, 'class': classNames.colour,
style: 'color:' + colour style: 'color:' + colour
}); });
if ( !newTreeTop ) { if ( !newTreeTop ) {
@ -1943,9 +1940,9 @@ var stylesRewriters = {
newTreeBottom.appendChild( empty( node ) ); newTreeBottom.appendChild( empty( node ) );
return newTreeBottom; return newTreeBottom;
}, },
TT: function ( node, parent ) { TT: function ( node, parent, config ) {
var el = createElement( node.ownerDocument, 'SPAN', { var el = createElement( node.ownerDocument, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': config.classNames.fontFamily,
style: 'font-family:menlo,consolas,"courier new",monospace' style: 'font-family:menlo,consolas,"courier new",monospace'
}); });
parent.replaceChild( el, node ); parent.replaceChild( el, node );
@ -1969,7 +1966,7 @@ var walker = new TreeWalker( null, SHOW_TEXT|SHOW_ELEMENT, function () {
and whitespace nodes. and whitespace nodes.
2. Convert inline tags into our preferred format. 2. Convert inline tags into our preferred format.
*/ */
var cleanTree = function cleanTree ( node, preserveWS ) { var cleanTree = function cleanTree ( node, config, preserveWS ) {
var children = node.childNodes, var children = node.childNodes,
nonInlineParent, i, l, child, nodeName, nodeType, rewriter, childLength, nonInlineParent, i, l, child, nodeName, nodeType, rewriter, childLength,
startsWithWS, endsWithWS, data, sibling; startsWithWS, endsWithWS, data, sibling;
@ -1988,7 +1985,7 @@ var cleanTree = function cleanTree ( node, preserveWS ) {
if ( nodeType === ELEMENT_NODE ) { if ( nodeType === ELEMENT_NODE ) {
childLength = child.childNodes.length; childLength = child.childNodes.length;
if ( rewriter ) { if ( rewriter ) {
child = rewriter( child, node ); child = rewriter( child, node, config );
} else if ( blacklist.test( nodeName ) ) { } else if ( blacklist.test( nodeName ) ) {
node.removeChild( child ); node.removeChild( child );
i -= 1; i -= 1;
@ -2001,7 +1998,8 @@ var cleanTree = function cleanTree ( node, preserveWS ) {
continue; continue;
} }
if ( childLength ) { if ( childLength ) {
cleanTree( child, preserveWS || ( nodeName === 'PRE' ) ); cleanTree( child, config,
preserveWS || ( nodeName === 'PRE' ) );
} }
} else { } else {
if ( nodeType === TEXT_NODE ) { if ( nodeType === TEXT_NODE ) {
@ -2634,6 +2632,12 @@ proto.setConfig = function ( config ) {
li: null, li: null,
a: null a: null
}, },
classNames: {
colour: 'colour',
fontFamily: 'font',
fontSize: 'size',
highlight: 'highlight'
},
leafNodeNames: leafNodeNames, leafNodeNames: leafNodeNames,
undo: { undo: {
documentSizeThreshold: -1, // -1 means no threshold documentSizeThreshold: -1, // -1 means no threshold
@ -3078,7 +3082,7 @@ proto._updatePath = function ( range, force ) {
this._lastAnchorNode = anchor; this._lastAnchorNode = anchor;
this._lastFocusNode = focus; this._lastFocusNode = focus;
newPath = ( anchor && focus ) ? ( anchor === focus ) ? newPath = ( anchor && focus ) ? ( anchor === focus ) ?
getPath( focus, this._root ) : '(selection)' : ''; getPath( focus, this._root, this._config ) : '(selection)' : '';
if ( this._path !== newPath ) { if ( this._path !== newPath ) {
this._path = newPath; this._path = newPath;
this.fireEvent( 'pathChange', { path: newPath } ); this.fireEvent( 'pathChange', { path: newPath } );
@ -4149,7 +4153,7 @@ proto.setHTML = function ( html ) {
frag.appendChild( empty( div ) ); frag.appendChild( empty( div ) );
} }
cleanTree( frag ); cleanTree( frag, config );
cleanupBRs( frag, root, false ); cleanupBRs( frag, root, false );
fixContainer( frag, root ); fixContainer( frag, root );
@ -4335,7 +4339,7 @@ proto.insertHTML = function ( html, isPaste ) {
}; };
addLinks( frag, frag, this ); addLinks( frag, frag, this );
cleanTree( frag ); cleanTree( frag, config );
cleanupBRs( frag, root, false ); cleanupBRs( frag, root, false );
removeEmptyInlines( frag ); removeEmptyInlines( frag );
frag.normalize(); frag.normalize();
@ -4472,57 +4476,61 @@ proto.removeLink = function () {
}; };
proto.setFontFace = function ( name ) { proto.setFontFace = function ( name ) {
var className = this._config.classNames.fontFamily;
this.changeFormat( name ? { this.changeFormat( name ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': FONT_FAMILY_CLASS, 'class': className,
style: 'font-family: ' + name + ', sans-serif;' style: 'font-family: ' + name + ', sans-serif;'
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': FONT_FAMILY_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setFontSize = function ( size ) { proto.setFontSize = function ( size ) {
var className = this._config.classNames.fontSize;
this.changeFormat( size ? { this.changeFormat( size ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': FONT_SIZE_CLASS, 'class': className,
style: 'font-size: ' + style: 'font-size: ' +
( typeof size === 'number' ? size + 'px' : size ) ( typeof size === 'number' ? size + 'px' : size )
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': FONT_SIZE_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setTextColour = function ( colour ) { proto.setTextColour = function ( colour ) {
var className = this._config.classNames.colour;
this.changeFormat( colour ? { this.changeFormat( colour ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': COLOUR_CLASS, 'class': className,
style: 'color:' + colour style: 'color:' + colour
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': COLOUR_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setHighlightColour = function ( colour ) { proto.setHighlightColour = function ( colour ) {
var className = this._config.classNames.highlight;
this.changeFormat( colour ? { this.changeFormat( colour ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': HIGHLIGHT_CLASS, 'class': className,
style: 'background-color:' + colour style: 'background-color:' + colour
} }
} : colour, { } : colour, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': HIGHLIGHT_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };

4
build/squire.js
View file

File diff suppressed because one or more lines are too long

52
source/Clean.js
View file

@ -13,18 +13,18 @@ var fontSizes = {
var styleToSemantic = { var styleToSemantic = {
backgroundColor: { backgroundColor: {
regexp: notWS, regexp: notWS,
replace: function ( doc, colour ) { replace: function ( doc, classNames, colour ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': HIGHLIGHT_CLASS, 'class': classNames.highlight,
style: 'background-color:' + colour style: 'background-color:' + colour
}); });
} }
}, },
color: { color: {
regexp: notWS, regexp: notWS,
replace: function ( doc, colour ) { replace: function ( doc, classNames, colour ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': COLOUR_CLASS, 'class': classNames.colour,
style: 'color:' + colour style: 'color:' + colour
}); });
} }
@ -43,18 +43,18 @@ var styleToSemantic = {
}, },
fontFamily: { fontFamily: {
regexp: notWS, regexp: notWS,
replace: function ( doc, family ) { replace: function ( doc, classNames, family ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': classNames.fontFamily,
style: 'font-family:' + family style: 'font-family:' + family
}); });
} }
}, },
fontSize: { fontSize: {
regexp: notWS, regexp: notWS,
replace: function ( doc, size ) { replace: function ( doc, classNames, size ) {
return createElement( doc, 'SPAN', { return createElement( doc, 'SPAN', {
'class': FONT_SIZE_CLASS, 'class': classNames.fontSize,
style: 'font-size:' + size style: 'font-size:' + size
}); });
} }
@ -76,7 +76,7 @@ var replaceWithTag = function ( tag ) {
}; };
}; };
var replaceStyles = function ( node, parent ) { var replaceStyles = function ( node, parent, config ) {
var style = node.style; var style = node.style;
var doc = node.ownerDocument; var doc = node.ownerDocument;
var attr, converter, css, newTreeBottom, newTreeTop, el; var attr, converter, css, newTreeBottom, newTreeTop, el;
@ -85,7 +85,7 @@ var replaceStyles = function ( node, parent ) {
converter = styleToSemantic[ attr ]; converter = styleToSemantic[ attr ];
css = style[ attr ]; css = style[ attr ];
if ( css && converter.regexp.test( css ) ) { if ( css && converter.regexp.test( css ) ) {
el = converter.replace( doc, css ); el = converter.replace( doc, config.classNames, css );
if ( !newTreeTop ) { if ( !newTreeTop ) {
newTreeTop = el; newTreeTop = el;
} }
@ -116,16 +116,17 @@ var stylesRewriters = {
EM: replaceWithTag( 'I' ), EM: replaceWithTag( 'I' ),
INS: replaceWithTag( 'U' ), INS: replaceWithTag( 'U' ),
STRIKE: replaceWithTag( 'S' ), STRIKE: replaceWithTag( 'S' ),
FONT: function ( node, parent ) { FONT: function ( node, parent, config ) {
var face = node.face, var face = node.face;
size = node.size, var size = node.size;
colour = node.color, var colour = node.color;
doc = node.ownerDocument, var doc = node.ownerDocument;
fontSpan, sizeSpan, colourSpan, var classNames = config.classNames;
newTreeBottom, newTreeTop; var fontSpan, sizeSpan, colourSpan;
var newTreeBottom, newTreeTop;
if ( face ) { if ( face ) {
fontSpan = createElement( doc, 'SPAN', { fontSpan = createElement( doc, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': classNames.fontFamily,
style: 'font-family:' + face style: 'font-family:' + face
}); });
newTreeTop = fontSpan; newTreeTop = fontSpan;
@ -133,7 +134,7 @@ var stylesRewriters = {
} }
if ( size ) { if ( size ) {
sizeSpan = createElement( doc, 'SPAN', { sizeSpan = createElement( doc, 'SPAN', {
'class': FONT_SIZE_CLASS, 'class': classNames.fontSize,
style: 'font-size:' + fontSizes[ size ] + 'px' style: 'font-size:' + fontSizes[ size ] + 'px'
}); });
if ( !newTreeTop ) { if ( !newTreeTop ) {
@ -149,7 +150,7 @@ var stylesRewriters = {
colour = '#' + colour; colour = '#' + colour;
} }
colourSpan = createElement( doc, 'SPAN', { colourSpan = createElement( doc, 'SPAN', {
'class': COLOUR_CLASS, 'class': classNames.colour,
style: 'color:' + colour style: 'color:' + colour
}); });
if ( !newTreeTop ) { if ( !newTreeTop ) {
@ -167,9 +168,9 @@ var stylesRewriters = {
newTreeBottom.appendChild( empty( node ) ); newTreeBottom.appendChild( empty( node ) );
return newTreeBottom; return newTreeBottom;
}, },
TT: function ( node, parent ) { TT: function ( node, parent, config ) {
var el = createElement( node.ownerDocument, 'SPAN', { var el = createElement( node.ownerDocument, 'SPAN', {
'class': FONT_FAMILY_CLASS, 'class': config.classNames.fontFamily,
style: 'font-family:menlo,consolas,"courier new",monospace' style: 'font-family:menlo,consolas,"courier new",monospace'
}); });
parent.replaceChild( el, node ); parent.replaceChild( el, node );
@ -193,7 +194,7 @@ var walker = new TreeWalker( null, SHOW_TEXT|SHOW_ELEMENT, function () {
and whitespace nodes. and whitespace nodes.
2. Convert inline tags into our preferred format. 2. Convert inline tags into our preferred format.
*/ */
var cleanTree = function cleanTree ( node, preserveWS ) { var cleanTree = function cleanTree ( node, config, preserveWS ) {
var children = node.childNodes, var children = node.childNodes,
nonInlineParent, i, l, child, nodeName, nodeType, rewriter, childLength, nonInlineParent, i, l, child, nodeName, nodeType, rewriter, childLength,
startsWithWS, endsWithWS, data, sibling; startsWithWS, endsWithWS, data, sibling;
@ -212,7 +213,7 @@ var cleanTree = function cleanTree ( node, preserveWS ) {
if ( nodeType === ELEMENT_NODE ) { if ( nodeType === ELEMENT_NODE ) {
childLength = child.childNodes.length; childLength = child.childNodes.length;
if ( rewriter ) { if ( rewriter ) {
child = rewriter( child, node ); child = rewriter( child, node, config );
} else if ( blacklist.test( nodeName ) ) { } else if ( blacklist.test( nodeName ) ) {
node.removeChild( child ); node.removeChild( child );
i -= 1; i -= 1;
@ -225,7 +226,8 @@ var cleanTree = function cleanTree ( node, preserveWS ) {
continue; continue;
} }
if ( childLength ) { if ( childLength ) {
cleanTree( child, preserveWS || ( nodeName === 'PRE' ) ); cleanTree( child, config,
preserveWS || ( nodeName === 'PRE' ) );
} }
} else { } else {
if ( nodeType === TEXT_NODE ) { if ( nodeType === TEXT_NODE ) {

5
source/Constants.js
View file

@ -13,11 +13,6 @@ var START_TO_END = 1; // Range.START_TO_END
var END_TO_END = 2; // Range.END_TO_END var END_TO_END = 2; // Range.END_TO_END
var END_TO_START = 3; // Range.END_TO_START var END_TO_START = 3; // Range.END_TO_START
var HIGHLIGHT_CLASS = 'highlight';
var COLOUR_CLASS = 'colour';
var FONT_FAMILY_CLASS = 'font';
var FONT_SIZE_CLASS = 'size';
var ZWS = '\u200B'; var ZWS = '\u200B';
var win = doc.defaultView; var win = doc.defaultView;

32
source/Editor.js
View file

@ -171,6 +171,12 @@ proto.setConfig = function ( config ) {
li: null, li: null,
a: null a: null
}, },
classNames: {
colour: 'colour',
fontFamily: 'font',
fontSize: 'size',
highlight: 'highlight'
},
leafNodeNames: leafNodeNames, leafNodeNames: leafNodeNames,
undo: { undo: {
documentSizeThreshold: -1, // -1 means no threshold documentSizeThreshold: -1, // -1 means no threshold
@ -615,7 +621,7 @@ proto._updatePath = function ( range, force ) {
this._lastAnchorNode = anchor; this._lastAnchorNode = anchor;
this._lastFocusNode = focus; this._lastFocusNode = focus;
newPath = ( anchor && focus ) ? ( anchor === focus ) ? newPath = ( anchor && focus ) ? ( anchor === focus ) ?
getPath( focus, this._root ) : '(selection)' : ''; getPath( focus, this._root, this._config ) : '(selection)' : '';
if ( this._path !== newPath ) { if ( this._path !== newPath ) {
this._path = newPath; this._path = newPath;
this.fireEvent( 'pathChange', { path: newPath } ); this.fireEvent( 'pathChange', { path: newPath } );
@ -1686,7 +1692,7 @@ proto.setHTML = function ( html ) {
frag.appendChild( empty( div ) ); frag.appendChild( empty( div ) );
} }
cleanTree( frag ); cleanTree( frag, config );
cleanupBRs( frag, root, false ); cleanupBRs( frag, root, false );
fixContainer( frag, root ); fixContainer( frag, root );
@ -1872,7 +1878,7 @@ proto.insertHTML = function ( html, isPaste ) {
}; };
addLinks( frag, frag, this ); addLinks( frag, frag, this );
cleanTree( frag ); cleanTree( frag, config );
cleanupBRs( frag, root, false ); cleanupBRs( frag, root, false );
removeEmptyInlines( frag ); removeEmptyInlines( frag );
frag.normalize(); frag.normalize();
@ -2009,57 +2015,61 @@ proto.removeLink = function () {
}; };
proto.setFontFace = function ( name ) { proto.setFontFace = function ( name ) {
var className = this._config.classNames.fontFamily;
this.changeFormat( name ? { this.changeFormat( name ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': FONT_FAMILY_CLASS, 'class': className,
style: 'font-family: ' + name + ', sans-serif;' style: 'font-family: ' + name + ', sans-serif;'
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': FONT_FAMILY_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setFontSize = function ( size ) { proto.setFontSize = function ( size ) {
var className = this._config.classNames.fontSize;
this.changeFormat( size ? { this.changeFormat( size ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': FONT_SIZE_CLASS, 'class': className,
style: 'font-size: ' + style: 'font-size: ' +
( typeof size === 'number' ? size + 'px' : size ) ( typeof size === 'number' ? size + 'px' : size )
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': FONT_SIZE_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setTextColour = function ( colour ) { proto.setTextColour = function ( colour ) {
var className = this._config.classNames.colour;
this.changeFormat( colour ? { this.changeFormat( colour ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': COLOUR_CLASS, 'class': className,
style: 'color:' + colour style: 'color:' + colour
} }
} : null, { } : null, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': COLOUR_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };
proto.setHighlightColour = function ( colour ) { proto.setHighlightColour = function ( colour ) {
var className = this._config.classNames.highlight;
this.changeFormat( colour ? { this.changeFormat( colour ? {
tag: 'SPAN', tag: 'SPAN',
attributes: { attributes: {
'class': HIGHLIGHT_CLASS, 'class': className,
style: 'background-color:' + colour style: 'background-color:' + colour
} }
} : colour, { } : colour, {
tag: 'SPAN', tag: 'SPAN',
attributes: { 'class': HIGHLIGHT_CLASS } attributes: { 'class': className }
}); });
return this.focus(); return this.focus();
}; };

15
source/Node.js
View file

@ -129,11 +129,11 @@ function isOrContains ( parent, node ) {
return false; return false;
} }
function getPath ( node, root ) { function getPath ( node, root, config ) {
var path = ''; var path = '';
var id, className, classNames, dir; var id, className, classNames, dir, styleNames;
if ( node && node !== root ) { if ( node && node !== root ) {
path = getPath( node.parentNode, root ); path = getPath( node.parentNode, root, config );
if ( node.nodeType === ELEMENT_NODE ) { if ( node.nodeType === ELEMENT_NODE ) {
path += ( path ? '>' : '' ) + node.nodeName; path += ( path ? '>' : '' ) + node.nodeName;
if ( id = node.id ) { if ( id = node.id ) {
@ -149,19 +149,20 @@ function getPath ( node, root ) {
path += '[dir=' + dir + ']'; path += '[dir=' + dir + ']';
} }
if ( classNames ) { if ( classNames ) {
if ( indexOf.call( classNames, HIGHLIGHT_CLASS ) > -1 ) { styleNames = config.classNames;
if ( indexOf.call( classNames, styleNames.highlight ) > -1 ) {
path += '[backgroundColor=' + path += '[backgroundColor=' +
node.style.backgroundColor.replace( / /g,'' ) + ']'; node.style.backgroundColor.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, COLOUR_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.colour ) > -1 ) {
path += '[color=' + path += '[color=' +
node.style.color.replace( / /g,'' ) + ']'; node.style.color.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, FONT_FAMILY_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.fontFamily ) > -1 ) {
path += '[fontFamily=' + path += '[fontFamily=' +
node.style.fontFamily.replace( / /g,'' ) + ']'; node.style.fontFamily.replace( / /g,'' ) + ']';
} }
if ( indexOf.call( classNames, FONT_SIZE_CLASS ) > -1 ) { if ( indexOf.call( classNames, styleNames.fontSize ) > -1 ) {
path += '[fontSize=' + node.style.fontSize + ']'; path += '[fontSize=' + node.style.fontSize + ']';
} }
} }