mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-11-25 06:46:26 +00:00
Simple and temporary playground to work on retrieving content changes from content editable element.
This commit is contained in:
parent
3227903d48
commit
4e81a183c4
Notes:
Gabriel Wicke
2012-02-27 16:40:01 +00:00
20
playground/index.html
Normal file
20
playground/index.html
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Playground</title>
|
||||||
|
<style>
|
||||||
|
#editor {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border: solid 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="../modules/jquery/jquery.js"></script>
|
||||||
|
<script src="playground.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div contenteditable="true" id="editor">
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
79
playground/playground.js
Normal file
79
playground/playground.js
Normal file
|
@ -0,0 +1,79 @@
|
||||||
|
app = function () {
|
||||||
|
var _this = this,
|
||||||
|
$document = $( document );
|
||||||
|
|
||||||
|
this.$editor = $('#editor');
|
||||||
|
|
||||||
|
this.$editor.bind( {
|
||||||
|
'focus': function( e ) {
|
||||||
|
$document.unbind( '.surfaceView' );
|
||||||
|
$document.bind( {
|
||||||
|
'keydown.surfaceView': function( e ) {
|
||||||
|
return _this.onKeyDown( e );
|
||||||
|
}
|
||||||
|
} );
|
||||||
|
},
|
||||||
|
'blur': function( e ) {
|
||||||
|
$document.unbind( '.surfaceView' );
|
||||||
|
}
|
||||||
|
} );
|
||||||
|
|
||||||
|
this.$editor.mousedown( function(e) {
|
||||||
|
return _this.onMouseDown( e );
|
||||||
|
} );
|
||||||
|
|
||||||
|
// Set initial content for the "editor"
|
||||||
|
this.$editor.html("<b>Lorem Ipsum is simply dummy text</b> of the printing and typesetting industry. <b>Lorem Ipsum has been the <i>industry's</i> standard</b> dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it <u>to <b>make <i>a type</i> specimen</b> book.</u>");
|
||||||
|
|
||||||
|
this.prevText = app.getDOMText(this.$editor[0]);
|
||||||
|
|
||||||
|
setInterval(function() {
|
||||||
|
_this.loopFunc();
|
||||||
|
}, 200);
|
||||||
|
};
|
||||||
|
|
||||||
|
app.prototype.onKeyDown = function() {
|
||||||
|
console.log("onKeyDown");
|
||||||
|
};
|
||||||
|
|
||||||
|
app.prototype.onMouseDown = function() {
|
||||||
|
console.log("onMouseDown");
|
||||||
|
};
|
||||||
|
|
||||||
|
app.prototype.loopFunc = function() {
|
||||||
|
var text = app.getDOMText(this.$editor[0]);
|
||||||
|
|
||||||
|
if(text != this.prevText) {
|
||||||
|
console.log(text);
|
||||||
|
|
||||||
|
this.prevText = text;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
app.getDOMText = function( elem ) {
|
||||||
|
var nodeType = elem.nodeType,
|
||||||
|
ret = '';
|
||||||
|
|
||||||
|
if ( nodeType === 1 || nodeType === 9 ) {
|
||||||
|
// Use textContent || innerText for elements
|
||||||
|
if ( typeof elem.textContent === 'string' ) {
|
||||||
|
return elem.textContent;
|
||||||
|
} else if ( typeof elem.innerText === 'string' ) {
|
||||||
|
// Replace IE's carriage returns
|
||||||
|
return elem.innerText.replace( /\r\n/g, '' );
|
||||||
|
} else {
|
||||||
|
// Traverse it's children
|
||||||
|
for ( elem = elem.firstChild; elem; elem = elem.nextSibling) {
|
||||||
|
ret += app.getDOMText( elem );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else if ( nodeType === 3 || nodeType === 4 ) {
|
||||||
|
return elem.nodeValue;
|
||||||
|
}
|
||||||
|
|
||||||
|
return ret;
|
||||||
|
};
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
new app();
|
||||||
|
});
|
Loading…
Reference in a new issue