| 12345678910111213141516171819202122232425262728293031323334353637383940 |
- <div contenteditable="true" id="editor">
- <p>Foo</p>
- <p>Bar</p>
- </div>
- <script>
- 'use strict';
- bender.amd.manualRequire( [
- 'core/treeview/treeview',
- 'core/treeview/observer/mutationobserver',
- 'core/treeview/text'
- ], function( TreeView, MutationObserver, Text ) {
- const treeView = new TreeView( document.getElementById( 'editor' ) );
- const mutationObserver = new MutationObserver();
- mutationObserver.on( 'mutations', ( evt, mutations ) => {
- console.log( mutations );
- } );
- mutationObserver.on( 'mutations', handleTyping );
-
- treeView.addObserver( mutationObserver );
- treeView.viewRoot.insertChildren( 0, new Text( 'bom' ) );
- treeView.render();
- console.log( treeView );
- } );
- function handleTyping( evt, mutations ) {
- const mutation = mutations[ 0 ];
- if( mutations.length > 1 || mutation.type !== 'text' ) {
- return;
- }
- mutation.node.setText( mutation.newText );
- }
- </script>
|