/* * This file is part of the MediaWiki extension MultimediaViewer. * * MultimediaViewer is free software: you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation, either version 2 of the License, or * (at your option) any later version. * * MultimediaViewer is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. * * You should have received a copy of the GNU General Public License * along with MultimediaViewer. If not, see . */ ( function ( mw, $, oo, moment ) { // Shortcut for prototype later var MPP; /** * Represents the metadata panel in the viewer * @class mw.mmv.ui.MetadataPanel * @extends mw.mmv.ui.Element * @constructor * @param {jQuery} $container The container for the panel. * @param {jQuery} $controlBar The control bar element. */ function MetadataPanel( $container, $controlBar ) { mw.mmv.ui.Element.call( this, $container ); this.$controlBar = $controlBar; this.initializeHeader(); this.initializeImageMetadata(); this.initializeAboutLinks(); } oo.inheritClass( MetadataPanel, mw.mmv.ui.Element ); MPP = MetadataPanel.prototype; MPP.attach = function() { var panel = this; this.handleEvent( 'keydown', function ( e ) { panel.keydown( e ); } ); }; MPP.unattach = function() { this.clearEvents(); }; MPP.empty = function () { this.$license.empty().addClass( 'empty' ); this.description.empty(); this.categories.empty(); this.fileUsage.empty(); this.$title.empty(); this.$credit.empty().addClass( 'empty' ); this.$username.empty(); this.$usernameLi.addClass( 'empty' ); this.$repo.empty(); this.$repoLi.addClass( 'empty' ); this.$datetime.empty(); this.$datetimeLi.addClass( 'empty' ); this.$location.empty(); this.$locationLi.addClass( 'empty' ); this.$dragIcon.removeClass( 'pointing-down' ); this.fileReuse.empty(); }; // ********************************************** // *********** Initialization methods *********** // ********************************************** /** * Initializes the header, which contains the title, credit, and license elements. */ MPP.initializeHeader = function () { var panel = this; this.$dragBar = $( '
' ) .addClass( 'mw-mlb-drag-affordance' ) .appendTo( this.$controlBar ) .click( function () { panel.toggle(); } ); this.$dragIcon = $( '
' ) .addClass( 'mw-mlb-drag-icon' ) .appendTo( this.$dragBar ); this.$titleDiv = $( '
' ) .addClass( 'mw-mlb-title-contain' ) .appendTo( this.$controlBar ); this.$container.append( this.$controlBar ); this.initializeTitleAndCredit(); this.initializeLicense(); }; /** * Initializes the title and credit elements. */ MPP.initializeTitleAndCredit = function () { this.$titleAndCredit = $( '
' ) .addClass( 'mw-mlb-title-credit' ) .appendTo( this.$titleDiv ); this.initializeTitle(); this.initializeCredit(); }; /** * Initializes the title elements. */ MPP.initializeTitle = function () { this.$titlePara = $( '

' ) .addClass( 'mw-mlb-title-para' ) .appendTo( this.$titleAndCredit ); this.$title = $( '' ) .addClass( 'mw-mlb-title' ) .appendTo( this.$titlePara ); }; /** * Initializes the credit elements. */ MPP.initializeCredit = function () { this.$source = $( '' ) .addClass( 'mw-mlb-source' ); this.$author = $( '' ) .addClass( 'mw-mlb-author' ); this.$credit = $( '

' ) .addClass( 'mw-mlb-credit empty' ) .html( mw.message( 'multimediaviewer-credit', this.$author.get( 0 ).outerHTML, this.$source.get( 0 ).outerHTML ).plain() ) .appendTo( this.$titleAndCredit ); }; /** * Initializes the license elements. */ MPP.initializeLicense = function () { this.$license = $( '' ) .addClass( 'mw-mlb-license empty' ) .prop( 'href', '#' ) .appendTo( this.$titlePara ); }; /** * Initializes the main body of metadata elements. */ MPP.initializeImageMetadata = function () { this.$imageMetadata = $( '

' ) .addClass( 'mw-mlb-image-metadata' ) .appendTo( this.$container ); this.description = new mw.mmv.ui.Description( this.$imageMetadata ); this.initializeImageLinks(); }; /** * Initializes the list of image metadata on the right side of the panel. */ MPP.initializeImageLinks = function () { this.$imageLinkDiv = $( '
' ) .addClass( 'mw-mlb-image-links-div' ) .appendTo( this.$imageMetadata ); this.$imageLinks = $( '