mediawiki-extensions-Visual.../modules/ve-mw/ui/widgets/ve.ui.MWGalleryItemWidget.js
James D. Forrester 0a7a845a42 doc: Bump copyright year
Change-Id: I0b299c840ede1a1b8552cecfc70c5760ab036181
2018-01-03 17:45:07 +00:00

97 lines
2.4 KiB
JavaScript

/*!
* VisualEditor user interface MWGalleryItemWidget class.
*
* @copyright 2011-2018 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 ) );
OO.ui.mixin.TabIndexedElement.call( this, config );
this.$element.on( {
click: this.onItemClick.bind( this ),
keypress: this.onItemKeyPress.bind( this )
} );
};
/* Inheritance */
OO.inheritClass( ve.ui.MWGalleryItemWidget, OO.ui.Widget );
OO.mixinClass( ve.ui.MWGalleryItemWidget, OO.ui.mixin.DraggableElement );
OO.mixinClass( ve.ui.MWGalleryItemWidget, OO.ui.mixin.TabIndexedElement );
/* Events */
/**
* @event edit
*/
/* Methods */
/**
* Handle clicking on an item
*/
ve.ui.MWGalleryItemWidget.prototype.onItemClick = function () {
this.emit( 'edit', this );
};
/**
* Handle key press events
*
* @param {jQuery.Event} e Key press event
*/
ve.ui.MWGalleryItemWidget.prototype.onItemKeyPress = function ( e ) {
if ( e.which === OO.ui.Keys.ENTER ) {
this.emit( 'edit', this );
return false;
}
};
/**
* Set the caption property
*
* @param {string} caption The caption
*/
ve.ui.MWGalleryItemWidget.prototype.setCaption = function ( caption ) {
this.caption = caption.replace( '\n', ' ' );
};
/**
* 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 );
};