%PDF-
%PDF-
Mini Shell
Mini Shell
<!DOCTYPE html>
<html>
<!--
/*!
* VisualEditor event sequencer page
*
* @copyright 2011-2016 VisualEditor Team and others; see http://ve.mit-license.org
*/
-->
<head>
<meta charset="utf-8">
<style>
#good, #bad {
min-height: 2em;
border: 1px solid red;
}
</style>
<script src="../../lib/jquery/jquery.js"></script>
<script src="../../lib/oojs/oojs.jquery.js"></script>
<script src="../../lib/unicodejs/unicodejs.js"></script>
<script src="../../src/ve.js"></script>
<script src="../../src/ve.utils.js"></script>
<script src="../../src/ve.EventSequencer.js"></script>
<script src="../../src/ce/ve.ce.js"></script>
<script>
function makeListener( message ) {
return function ( e ) {
console.log( message + showEventCode( e ) +
' ' + JSON.stringify( document.getElementById(
'good' ).innerHTML ) );
};
};
function onbodyload () {
var i, len, eventSequencer, eventName,
onEvents = {},
afterEvents = {},
eventNames = ['compositionstart', 'compositionend',
'keydown', 'keyup', 'keypress'],
badDiv = document.getElementById( 'bad' ),
goodDiv = document.getElementById( 'good' );
for ( i = 0, len = eventNames.length; i < len; i++ ) {
eventName = eventNames[i];
onEvents[eventName] = makeListener( 'on ' + eventName );
afterEvents[eventName] = makeListener(
'after ' + eventName );
addSetTimeoutListeners( badDiv, eventName );
}
eventSequencer = new ve.EventSequencer( eventNames )
.on( onEvents )
.after( afterEvents )
.attach( $( goodDiv ) );
goodDiv.focus();
}
function addSetTimeoutListeners( node, eventName ) {
node.addEventListener( eventName, function ( e ) {
console.log( eventName + showEventCode( e ) + ': ' +
JSON.stringify( node.innerHTML ) );
setTimeout( function () {
console.log( 'setTimeout from ' + eventName +
showEventCode( e ) + ': ' +
JSON.stringify( node.innerHTML ) );
} );
});
}
function showEventCode( e ) {
return ( e && e.keyCode ) ? '(keyCode=' + e.keyCode + ')' : '';
}
</script>
</head>
<body onload="onbodyload()">
Good (ve.EventSequencer):
<div id="good" contenteditable="true"></div>
Bad (setTimeout):
<div id="bad" contenteditable="true"></div>
</body>
</html>
Zerion Mini Shell 1.0