From 95e06e96bf0cf4965d3c3c2d9a304f762e6937ee Mon Sep 17 00:00:00 2001 From: Rob Moen Date: Mon, 21 May 2012 16:06:30 -0700 Subject: [PATCH] Prepare for MediaWiki integration Create context instance in surface. Move over getSelectionRect into ce.surface Cleanup ve.surface contstructor class Move linmod/html test objects to sandbox.js Change-Id: I0cf602ef991100bf6128c68750b02a00566911dc --- modules/sandbox/sandbox.js | 61 ++++++++++++++++++++++++-- modules/ve2/ce/ve.ce.Surface.js | 11 ++++- modules/ve2/ui/ve.ui.Context.js | 4 +- modules/ve2/ve.Surface.js | 76 ++------------------------------- 4 files changed, 73 insertions(+), 79 deletions(-) diff --git a/modules/sandbox/sandbox.js b/modules/sandbox/sandbox.js index f6b4c88f13..f3c23700bd 100644 --- a/modules/sandbox/sandbox.js +++ b/modules/sandbox/sandbox.js @@ -510,13 +510,66 @@ $(document).ready( function() { ); } - var linearModel = [ - { 'type': 'paragraph' }, + // Overwrite input data with example data + /* + data = [ + { 'type': 'heading', 'attributes': { 'level': 1 } }, 'a', 'b', 'c', - { 'type': '/paragraph' } + { 'type': '/heading' }, + { 'type': 'paragraph' }, + 'a', + ['b', { '{"type":"textStyle/bold"}': { 'type': 'textStyle/bold' } }], + ['c', { '{"type":"textStyle/italic"}': { 'type': 'textStyle/italic' } }], + { 'type': '/paragraph' }, + { 'type': 'paragraph' }, + { 'type': 'image', 'attributes': { 'html/src': 'http://placekitten.com/g/120/120' } }, + { 'type': '/image' }, + 'L', + 'o', + 'r', + 'e', + 'm', + ' ', + 'i', + 'p', + 's', + 'u', + 'm', + ' ', + { 'type': 'image', 'attributes': { 'html/src': 'http://placekitten.com/g/100/100' } }, + { 'type': '/image' }, + ' ', + 'a', + 'n', + 'd', + { 'type': '/paragraph' }, + { 'type': 'table' }, + { 'type': 'tableRow' }, + { 'type': 'tableCell' }, + { 'type': 'paragraph' }, + ['a', { + '{"type":"textStyle/italic"}': { 'type': 'textStyle/italic' }, + '{"type":"textStyle/bold"}': { 'type': 'textStyle/bold' } + }], + { 'type': '/paragraph' }, + { 'type': '/tableCell' }, + { 'type': '/tableRow' }, + { 'type': '/table' }, + { 'type': 'list', 'attributes': { 'style': 'bullet' } }, + { 'type': 'listItem', 'attributes': { 'style': 'item' } }, + { 'type': 'paragraph' }, + 'a', + { 'type': '/paragraph' }, + { 'type': '/listItem' }, + { 'type': '/list' }, + { 'type': 'image', 'attributes': { 'html/src': 'http://dl.dropbox.com/u/1026938/wikia.jpeg' } }, + { 'type': '/image' }, ]; + */ + // Define HTML5 DOM + var HTML = $( '
Hello world! What\'s up?

abc

abc

Lorem ipsum and

a

' ); /* Sandbox config object. */ var options = { @@ -532,7 +585,7 @@ $(document).ready( function() { Create Sandbox instance of VE Attach to #content element */ - var sandboxEditor = new ve.Surface( '#content', linearModel, options ), + var sandboxEditor = new ve.Surface( '#content', HTML[0], options ), surfaceModel = sandboxEditor.getSurfaceModel(), documentModel = sandboxEditor.getDocumentModel(), parent = sandboxEditor.getParent(); diff --git a/modules/ve2/ce/ve.ce.Surface.js b/modules/ve2/ce/ve.ce.Surface.js index 4ed37f1b39..c3c049fc0d 100644 --- a/modules/ve2/ce/ve.ce.Surface.js +++ b/modules/ve2/ce/ve.ce.Surface.js @@ -12,6 +12,7 @@ ve.ce.Surface = function( $container, model ) { // Properties this.model = model; this.documentView = new ve.ce.Document( model.getDocument() ); + this.contextView = new ve.ui.Context( this ); this.$ = $container; // Initialization @@ -19,7 +20,7 @@ ve.ce.Surface = function( $container, model ) { try { document.execCommand( "enableObjectResizing", false, false ); - document.execCommand( "enableInlineTableEditing", false, false ); + document.execCommand( "enableInlineTableEditing", false, false ); } catch (e) { } }; @@ -94,6 +95,14 @@ ve.ce.Surface.prototype.showSelection = function( range ) { rangySel.setSingleRange( rangyRange, range.start !== range.from ); }; +ve.ce.Surface.prototype.getSelectionRect = function() { + var rangySel = rangy.getSelection(); + return { + start: rangySel.getStartDocumentPos(), + end: rangySel.getEndDocumentPos() + }; +}; + /* Inheritance */ ve.extendClass( ve.ce.Surface, ve.EventEmitter ); diff --git a/modules/ve2/ui/ve.ui.Context.js b/modules/ve2/ui/ve.ui.Context.js index 6e97bc52fc..1246802d59 100644 --- a/modules/ve2/ui/ve.ui.Context.js +++ b/modules/ve2/ui/ve.ui.Context.js @@ -1,6 +1,6 @@ /** * Creates an ve.ui.Context object. - * + * * @class * @constructor * @param {jQuery} $overlay DOM selection to add nodes to @@ -13,7 +13,7 @@ ve.ui.Context = function( surfaceView, $overlay ) { // Properties this.surfaceView = surfaceView; - this.surfaceView.attachContextView( this ); + //this.surfaceView.attachContextView( this ); this.inspectors = {}; this.inspector = null; this.position = null; diff --git a/modules/ve2/ve.Surface.js b/modules/ve2/ve.Surface.js index 94fe17a494..6e33a86cf0 100644 --- a/modules/ve2/ve.Surface.js +++ b/modules/ve2/ve.Surface.js @@ -6,10 +6,12 @@ * @class * @constructor * @param {String} parent Selector of element to attach to - * @param {Array} data Document data + * @param {Array} html Document html * @param {Object} options Configuration options */ -ve.Surface = function( parent, data, options ) { +ve.Surface = function( parent, html, options ) { + // Create linear model from HTML5 DOM + var data = ve.dm.HTMLConverter.getLinearModel( html ); // Properties this.parent = parent; this.modes = {}; @@ -42,69 +44,6 @@ ve.Surface = function( parent, data, options ) { this.$surface = null; this.toolbarWrapper = {}; - // Overwrite input data with example data - /* - data = [ - { 'type': 'heading', 'attributes': { 'level': 1 } }, - 'a', - 'b', - 'c', - { 'type': '/heading' }, - { 'type': 'paragraph' }, - 'a', - ['b', { '{"type":"textStyle/bold"}': { 'type': 'textStyle/bold' } }], - ['c', { '{"type":"textStyle/italic"}': { 'type': 'textStyle/italic' } }], - { 'type': '/paragraph' }, - { 'type': 'paragraph' }, - { 'type': 'image', 'attributes': { 'html/src': 'http://placekitten.com/g/120/120' } }, - { 'type': '/image' }, - 'L', - 'o', - 'r', - 'e', - 'm', - ' ', - 'i', - 'p', - 's', - 'u', - 'm', - ' ', - { 'type': 'image', 'attributes': { 'html/src': 'http://placekitten.com/g/100/100' } }, - { 'type': '/image' }, - ' ', - 'a', - 'n', - 'd', - { 'type': '/paragraph' }, - { 'type': 'table' }, - { 'type': 'tableRow' }, - { 'type': 'tableCell' }, - { 'type': 'paragraph' }, - ['a', { - '{"type":"textStyle/italic"}': { 'type': 'textStyle/italic' }, - '{"type":"textStyle/bold"}': { 'type': 'textStyle/bold' } - }], - { 'type': '/paragraph' }, - { 'type': '/tableCell' }, - { 'type': '/tableRow' }, - { 'type': '/table' }, - { 'type': 'list', 'attributes': { 'style': 'bullet' } }, - { 'type': 'listItem', 'attributes': { 'style': 'item' } }, - { 'type': 'paragraph' }, - 'a', - { 'type': '/paragraph' }, - { 'type': '/listItem' }, - { 'type': '/list' }, - { 'type': 'image', 'attributes': { 'html/src': 'http://dl.dropbox.com/u/1026938/wikia.jpeg' } }, - { 'type': '/image' }, - ]; - */ - // Define HTML5 DOM - var HTML = $( '
Hello world! What\'s up?

abc

abc

Lorem ipsum and

a

' ); - // Create linear model from HTML5 DOM - data = ve.dm.HTMLConverter.getLinearModel( HTML[0] ); - /* Create document model object with the linear model */ this.documentModel = new ve.dm.Document ( data ); this.surfaceModel = new ve.dm.Surface( this.documentModel ); @@ -112,15 +51,11 @@ ve.Surface = function( parent, data, options ) { // Setup VE DOM Skeleton this.setupBaseElements(); - // Setup Surface View - //this.setupSurfaceView(); - this.$surface = $('
').attr('class', 'es-editor'); this.$base.find('.es-visual').append( this.$surface ); /* Instantiate surface layer */ this.view = new ve.ce.Surface( $( '.es-editor' ), this.getSurfaceModel() ); - //this.context = new ve.ui.Context( this.view ); // Setup toolbars based on this.options this.setupToolbars(); @@ -159,9 +94,6 @@ ve.Surface.prototype.setupBaseElements = function() { $( this.getParent() ).append( this.$base ); }; -ve.Surface.prototype.setupSurfaceView = function() { -}; - ve.Surface.prototype.setupToolbars = function() { var _this = this;