http://www.mediawiki.org/wiki/Special:Code/MediaWiki/89783
Revision: 89783
Author: tparscal
Date: 2011-06-09 18:33:48 +0000 (Thu, 09 Jun 2011)
Log Message:
-----------
Split old and new techniques in to a/b, using a for now to try and get more
accuracy out of it.
Modified Paths:
--------------
trunk/parsers/wikidom/demos/surface/index.html
Added Paths:
-----------
trunk/parsers/wikidom/lib/jquery.flow-a.js
trunk/parsers/wikidom/lib/jquery.flow-b.js
Removed Paths:
-------------
trunk/parsers/wikidom/lib/jquery.flow.js
Modified: trunk/parsers/wikidom/demos/surface/index.html
===================================================================
--- trunk/parsers/wikidom/demos/surface/index.html 2011-06-09 18:29:32 UTC
(rev 89782)
+++ trunk/parsers/wikidom/demos/surface/index.html 2011-06-09 18:33:48 UTC
(rev 89783)
@@ -13,7 +13,7 @@
<!-- EditSurface -->
<script type="text/javascript"
src="../../lib/jquery.js"></script>
<script type="text/javascript"
src="../../lib/jquery.closestToOffset.js"></script>
- <script type="text/javascript"
src="../../lib/jquery.flow.js"></script>
+ <script type="text/javascript"
src="../../lib/jquery.flow-a.js"></script>
<script type="text/javascript"
src="../../lib/jquery.editSurface.js"></script>
<!-- Demo -->
Added: trunk/parsers/wikidom/lib/jquery.flow-a.js
===================================================================
--- trunk/parsers/wikidom/lib/jquery.flow-a.js (rev 0)
+++ trunk/parsers/wikidom/lib/jquery.flow-a.js 2011-06-09 18:33:48 UTC (rev
89783)
@@ -0,0 +1,91 @@
+/*
+ * Flow jQuery plugin
+ */
+
+$.flow = { 'widthCache': {} };
+
+$.fn.flow = function( text ) {
+ var lineLimit = $(this).innerWidth();
+
+ // Wordify
+ var words = [],
+ word = { 'text': '', 'width': 0, 'metrics': [] };
+ for ( var i = 0; i < text.length; i++ ) {
+ var char = text[i];
+ // Boundary detection
+ var boundary = String( ' -\t\r\n\f' ).indexOf( char ) >= 0;
+ // Encoding
+ var charHtml = char
+ .replace( '&', '&' )
+ .replace( ' ', ' ' )
+ .replace( '<', '<' )
+ .replace( '>', '>' )
+ .replace( '\'', ''' )
+ .replace( '"', '"' );
+ // Measurement
+ var charWidth;
+ if ( typeof $.flow.widthCache[char] === 'undefined' ) {
+ charWidth = $.flow.widthCache[char] =
+ $( '<span>' + charHtml + '</span>' ).appendTo(
$(this) ).width();
+ } else {
+ charWidth = $.flow.widthCache[char];
+ }
+ // Virtual boundary
+ if ( word.width + charWidth >= lineLimit ) {
+ words[words.length] = word;
+ word = { 'text': '', 'width': 0, 'metrics': [] };
+ }
+ // Append
+ if ( boundary ) {
+ if ( word.text.length ) {
+ words[words.length] = word;
+ word = { 'text': '', 'width': 0, 'metrics': []
};
+ }
+ words[words.length] = { 'text': char, 'width':
charWidth, 'metrics': [charWidth] };
+ } else {
+ word.text += char;
+ word.width += charWidth;
+ word.metrics[word.metrics.length] = charWidth;
+ }
+ }
+ if ( word.text.length ) {
+ words[words.length] = word;
+ }
+
+ // Lineify
+ var lines = [],
+ line = { 'text': '', 'width': 0, 'metrics': [] };
+ for ( var i = 0; i < words.length; i++ ) {
+ var hardReturn = String( '\r\n\f' ).indexOf( words[i].text ) >=
0;
+ if ( line.width + words[i].width > lineLimit || hardReturn ) {
+ lines[lines.length] = line;
+ line = { 'text': '', 'width': 0, 'metrics': [] };
+ }
+ if ( !hardReturn && ( line.width > 0 || words[i].text !== ' ' )
) {
+ line.text += words[i].text;
+ line.width += words[i].width;
+ line.metrics = line.metrics.concat( words[i].metrics );
+ }
+ }
+ if ( line.text.length ) {
+ lines[lines.length] = line;
+ }
+
+ // Flow
+ $(this).empty();
+ for ( var i = 0; i < lines.length; i++ ) {
+ var $line = $( '<div class="editSurface-line"></div>' )
+ .data( 'metrics', lines[i].metrics )
+ .data( 'text', lines[i].text )
+ .data( 'line', i );
+ if ( lines[i].text.length ) {
+ $line.text( lines[i].text );
+ } else {
+ $line.html( ' ' );
+ $line.addClass( 'empty' );
+ }
+ $(this).append( $line );
+ }
+
+ return $(this);
+};
\ No newline at end of file
Property changes on: trunk/parsers/wikidom/lib/jquery.flow-a.js
___________________________________________________________________
Added: svn:mime-type
+ text/plain
Added: svn:eol-style
+ native
Copied: trunk/parsers/wikidom/lib/jquery.flow-b.js (from rev 89781,
trunk/parsers/wikidom/lib/jquery.flow.js)
===================================================================
--- trunk/parsers/wikidom/lib/jquery.flow-b.js (rev 0)
+++ trunk/parsers/wikidom/lib/jquery.flow-b.js 2011-06-09 18:33:48 UTC (rev
89783)
@@ -0,0 +1,94 @@
+/*
+ * Flow jQuery plugin
+ */
+
+$.flow = { 'widthCache': {} };
+
+$.fn.flow = function( text ) {
+ console.time( 'flow' );
+
+ function encodeHtml( c ) {
+ return c.replace( /\&/g, '&' )
+ .replace( /</g, '<' )
+ .replace( />/g, '>' );
+ }
+
+ var breakableRe = /[\s\r\n\f]/;
+
+ var $this = $(this);
+
+ $this.empty();
+
+ var width = $this.innerWidth();
+ var pos = 0;
+ var line = 0;
+
+ while( pos < text.length ) {
+ var lineStartPos = pos;
+ var breakPos = pos;
+
+ var $line = $( '<div class="editSurface-line"></div>'
).appendTo( $this );
+ var lineElem = $line.get(0);
+ var lineText = '';
+ var lineMetrics = [];
+ var lineWidth = 0;
+ var lastLineWidth = 0;
+
+ while ( pos < text.length && lineWidth < width ) {
+ // Append text
+ var c = text.charAt( pos );
+ lineText += c;
+ lineElem.innerHTML = encodeHtml( lineText );
+
+ // Get new line width from DOM
+ lastLineWidth = lineWidth;
+ // $.innerWidth call is expensive. Assume padding and
border = 0 and this should be okay
+ lineWidth = lineElem.offsetWidth;
+ // Push difference (character width)
+ lineMetrics.push( lineWidth - lastLineWidth );
+
+ if ( breakableRe( c ) ) {
+ breakPos = pos;
+ }
+
+ pos++;
+ }
+
+ if ( lineWidth >= width ) {
+ if ( breakPos === lineStartPos ) {
+ // There was no breakable position between the
start of the line and here, so we
+ // have some kind of long word. Or, the line
width is very small. Break at the
+ // previous character.
+ pos -= 1;
+ breakPos = pos;
+ } else {
+ // Include the breaking character in the
previous line
+ // TODO: How does this work with hyphens? Won't
they be to far right?
+ breakPos++;
+ }
+ // Move the position back to the last safe location
+ pos = breakPos;
+ // Truncate characters that won't fit
+ lineText = text.substring( lineStartPos, breakPos );
+ lineElem.innerHTML = encodeHtml( lineText );
+ // Don't leave metrics from truncated characters around
+ lineMetrics = lineMetrics.slice( 0, pos - lineStartPos
);
+ }
+
+ $line
+ .data( 'metrics', lineMetrics )
+ .data( 'text', lineText )
+ .data( 'line', line );
+
+ if ( lineStartPos === pos ) {
+ lineElem.innerHtml = ' ';
+ }
+
+ line++;
+ }
+
+ console.timeEnd( 'flow' );
+
+ return $this;
+};
+
Property changes on: trunk/parsers/wikidom/lib/jquery.flow-b.js
___________________________________________________________________
Added: svn:mime-type
+ text/plain
Added: svn:eol-style
+ native
Deleted: trunk/parsers/wikidom/lib/jquery.flow.js
===================================================================
--- trunk/parsers/wikidom/lib/jquery.flow.js 2011-06-09 18:29:32 UTC (rev
89782)
+++ trunk/parsers/wikidom/lib/jquery.flow.js 2011-06-09 18:33:48 UTC (rev
89783)
@@ -1,94 +0,0 @@
-/*
- * Flow jQuery plugin
- */
-
-$.flow = { 'widthCache': {} };
-
-$.fn.flow = function( text ) {
- console.time( 'flow' );
-
- function encodeHtml( c ) {
- return c.replace( /\&/g, '&' )
- .replace( /</g, '<' )
- .replace( />/g, '>' );
- }
-
- var breakableRe = /[\s\r\n\f]/;
-
- var $this = $(this);
-
- $this.empty();
-
- var width = $this.innerWidth();
- var pos = 0;
- var line = 0;
-
- while( pos < text.length ) {
- var lineStartPos = pos;
- var breakPos = pos;
-
- var $line = $( '<div class="editSurface-line"></div>'
).appendTo( $this );
- var lineElem = $line.get(0);
- var lineText = '';
- var lineMetrics = [];
- var lineWidth = 0;
- var lastLineWidth = 0;
-
- while ( pos < text.length && lineWidth < width ) {
- // Append text
- var c = text.charAt( pos );
- lineText += c;
- lineElem.innerHTML = encodeHtml( lineText );
-
- // Get new line width from DOM
- lastLineWidth = lineWidth;
- // $.innerWidth call is expensive. Assume padding and
border = 0 and this should be okay
- lineWidth = lineElem.offsetWidth;
- // Push difference (character width)
- lineMetrics.push( lineWidth - lastLineWidth );
-
- if ( breakableRe( c ) ) {
- breakPos = pos;
- }
-
- pos++;
- }
-
- if ( lineWidth >= width ) {
- if ( breakPos === lineStartPos ) {
- // There was no breakable position between the
start of the line and here, so we
- // have some kind of long word. Or, the line
width is very small. Break at the
- // previous character.
- pos -= 1;
- breakPos = pos;
- } else {
- // Include the breaking character in the
previous line
- // TODO: How does this work with hyphens? Won't
they be to far right?
- breakPos++;
- }
- // Move the position back to the last safe location
- pos = breakPos;
- // Truncate characters that won't fit
- lineText = text.substring( lineStartPos, breakPos );
- lineElem.innerHTML = encodeHtml( lineText );
- // Don't leave metrics from truncated characters around
- lineMetrics = lineMetrics.slice( 0, pos - lineStartPos
);
- }
-
- $line
- .data( 'metrics', lineMetrics )
- .data( 'text', lineText )
- .data( 'line', line );
-
- if ( lineStartPos === pos ) {
- lineElem.innerHtml = ' ';
- }
-
- line++;
- }
-
- console.timeEnd( 'flow' );
-
- return $this;
-};
-
_______________________________________________
MediaWiki-CVS mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-cvs
