mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-11-24 22:35:41 +00:00
Merge "Alien Phantoms"
This commit is contained in:
commit
6456177388
|
@ -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 );
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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 () {
|
||||
|
|
Loading…
Reference in a new issue