mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-12-01 17:36:35 +00:00
6fdbe9fd7e
Make new graphical interface for editing existing galleries and adding new galleries. NB The dialog does not yet support rich text in the image captions, nor does it provide separate fields for e.g. link, alt text, etc. These are dependent on parsing the text within the tag, which is yet to be implemented by Parsoid. For now, these attributes should be specified in wikitext in the image-specific caption field. Bug: T45037 Change-Id: I2b4082e991268241a15b9bbd6d85c94cdc2185f2
80 lines
2 KiB
JavaScript
80 lines
2 KiB
JavaScript
/*!
|
|
* VisualEditor user interface MWGalleryItemWidget class.
|
|
*
|
|
* @copyright 2016 VisualEditor Team and others; see AUTHORS.txt
|
|
* @license The MIT License (MIT); see LICENSE.txt
|
|
*/
|
|
|
|
/**
|
|
* Draggable item widget for the MWGalleryGroupWidget
|
|
*
|
|
* @class
|
|
* @extends OO.ui.Widget
|
|
* @mixins OO.ui.mixin.DraggableElement
|
|
*
|
|
* @constructor
|
|
* @param {Object} imageInfo Image information object
|
|
* @param {Object} [config] Configuration options
|
|
*/
|
|
ve.ui.MWGalleryItemWidget = function VeUiMWGalleryItemWidget( imageInfo, config ) {
|
|
this.imageTitle = imageInfo.title;
|
|
this.thumbUrl = imageInfo.thumbUrl;
|
|
this.caption = imageInfo.caption;
|
|
this.highlighted = false;
|
|
|
|
// Configuration initialization
|
|
config = config || {};
|
|
|
|
// Parent constructor
|
|
ve.ui.MWGalleryItemWidget.super.call( this, config );
|
|
|
|
this.$element
|
|
.addClass( 've-ui-mwGalleryDialog-image-container' ) // TODO: put in new CSS file?
|
|
.css( 'background-image', 'url(' + this.thumbUrl + ')' );
|
|
|
|
// Mixin constructors
|
|
OO.ui.mixin.DraggableElement.call( this, ve.extendObject( { $handle: this.$element }, this.config ) );
|
|
|
|
this.$element.on( 'click', this.onItemClick.bind( this ) );
|
|
};
|
|
|
|
/* Inheritance */
|
|
|
|
OO.inheritClass( ve.ui.MWGalleryItemWidget, OO.ui.Widget );
|
|
|
|
OO.mixinClass( ve.ui.MWGalleryItemWidget, OO.ui.mixin.DraggableElement );
|
|
|
|
/* Events */
|
|
|
|
/**
|
|
* @event edit
|
|
*/
|
|
|
|
/* Methods */
|
|
|
|
/**
|
|
* Handle clicking on an item
|
|
*/
|
|
ve.ui.MWGalleryItemWidget.prototype.onItemClick = function () {
|
|
this.emit( 'edit', this );
|
|
};
|
|
|
|
/**
|
|
* Set the caption property
|
|
*
|
|
* @param {string} caption The caption
|
|
*/
|
|
ve.ui.MWGalleryItemWidget.prototype.setCaption = function ( caption ) {
|
|
this.caption = caption;
|
|
};
|
|
|
|
/**
|
|
* Toggle highlighted class
|
|
*
|
|
* @param {boolean} highlighted The item is highlighted
|
|
*/
|
|
ve.ui.MWGalleryItemWidget.prototype.toggleHighlighted = function ( highlighted ) {
|
|
highlighted = highlighted !== undefined ? highlighted : !this.highlighted;
|
|
this.$element.toggleClass( 've-ui-mwGalleryDialog-image-container-highlighted', !!highlighted );
|
|
};
|