Merge "Alien Phantoms"

This commit is contained in:
Inez 2012-11-14 21:12:23 +00:00 committed by Gerrit Code Review
commit 6456177388
4 changed files with 48 additions and 3 deletions

View file

@ -23,6 +23,7 @@ ve.ce.AlienBlockNode = function VeCeAlienBlockNode( model ) {
// Events
this.model.addListenerMethod( this, 'update', 'onUpdate' );
this.$.on( 'mouseenter', ve.bind( this.onMouseEnter, this ) );
// Initialization
this.onUpdate();
@ -61,6 +62,25 @@ ve.ce.AlienBlockNode.prototype.onUpdate = function () {
} );
};
ve.ce.AlienBlockNode.prototype.onMouseEnter = function () {
var $phantoms = $( [] ),
$phantomTemplate = ve.ce.Surface.static.$phantomTemplate;
this.$.find( '.ve-ce-node-shield' ).each( function () {
var $shield = $( this ),
offset = $shield.offset();
$phantoms = $phantoms.add(
$phantomTemplate.clone().css( {
'top': offset.top,
'left': offset.left,
'height': $shield.height(),
'width': $shield.width(),
'background-position': -offset.left + 'px ' + -offset.top + 'px'
} )
);
} );
this.root.getSurface().$phantoms.empty().append( $phantoms );
};
/* Registration */
ve.ce.nodeFactory.register( 'alienBlock', ve.ce.AlienBlockNode );

View file

@ -5,13 +5,11 @@
* @license The MIT License (MIT); see LICENSE.txt
*/
/* Alien styling */
.ve-ce-alienBlockNode,
.ve-ce-alienInlineNode,
.ve-ce-alienBlockNode *,
.ve-ce-alienInlineNode * {
background-color: #FFFFBA !important;
position: relative !important;
top: 0 !important;
left: 0 !important;

View file

@ -34,6 +34,21 @@
display: none;
}
.ve-ce-phantoms {
cursor: not-allowed;
left: 0;
opacity: .85;
position: absolute;
top: 0;
}
.ve-ce-phantom {
background-image: -webkit-repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px );
background-image: -moz-repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px);
background-size: 14px 14px;
position: absolute;
}
#paste {
display: none;
height: 1px;

View file

@ -35,9 +35,9 @@ ve.ce.Surface = function VeCeSurface( $container, model, surface ) {
this.sluggable = true;
this.dragging = false;
this.selecting = false;
this.$phantoms = $( '<div class="ve-ce-phantoms">' );
// Events
this.surfaceObserver.addListenerMethods(
this, { 'contentChange': 'onContentChange', 'selectionChange': 'onSelectionChange' }
);
@ -61,6 +61,9 @@ ve.ce.Surface = function VeCeSurface( $container, model, surface ) {
if ( $.browser.msie ) {
this.$.on( 'beforepaste', ve.bind( this.onPaste, this ) );
}
this.$phantoms.on( 'mouseleave', ve.bind( function () {
this.$phantoms.empty();
}, this ) );
// Initialization
try {
@ -70,12 +73,21 @@ ve.ce.Surface = function VeCeSurface( $container, model, surface ) {
rangy.init();
ve.ce.Surface.clearLocalStorage();
this.$.append( this.documentView.getDocumentNode().$ );
this.$.append( this.$phantoms );
};
/* Inheritance */
ve.inheritClass( ve.ce.Surface, ve.EventEmitter );
/* Static Members */
ve.ce.Surface.static = {};
ve.ce.Surface.static.$phantomTemplate = $( '<div class="ve-ce-phantom" draggable="false"></div>' )
// TODO: I18N
.attr( 'title', 'Sorry, this element cannot be edited with the Visual Editor' );
/* Methods */
ve.ce.Surface.prototype.handleInsertion = function () {