1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
|
/*!
* MediaWiki Widgets - StashedFileWidget class.
*
* @copyright 2011-2016 MediaWiki Widgets Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
( function ( $, mw, OO ) {
/**
* Accepts a stashed file and displays the information for purposes of
* publishing the file at the behest of the user.
*
* Example use:
* var widget = new mw.widgets.StashedFileWidget( {
* filekey: '12r9e4rugeec.ddtmmp.1.jpg',
* } );
*
* widget.getValue(); // '12r9e4rugeec.ddtmmp.1.jpg'
* widget.setValue( '12r9epfbnskk.knfiy7.1.jpg' );
* widget.getValue(); // '12r9epfbnskk.knfiy7.1.jpg'
*
* Note that this widget will not finish an upload for you. Use mw.Upload
* and mw.Upload#setFilekey, then mw.Upload#finishStashUpload to accomplish
* that.
*
* @class mw.widgets.StashedFileWidget
* @extends OO.ui.Widget
*/
/**
* @constructor
* @param {Object} config Configuration options
* @cfg {string} filekey The filekey of the stashed file.
* @cfg {Object} [api] API to use for thumbnails.
*/
mw.widgets.StashedFileWidget = function MWWStashedFileWidget( config ) {
if ( !config.api ) {
config.api = new mw.Api();
}
// Parent constructor
mw.widgets.StashedFileWidget.parent.call( this, config );
// Mixin constructors
OO.ui.mixin.IconElement.call( this, config );
OO.ui.mixin.LabelElement.call( this, config );
OO.ui.mixin.PendingElement.call( this, config );
// Properties
this.api = config.api;
this.$info = $( '<span>' );
this.setValue( config.filekey );
this.$label.addClass( 'mw-widgets-stashedFileWidget-label' );
this.$info
.addClass( 'mw-widgets-stashedFileWidget-info' )
.append( this.$icon, this.$label );
this.$thumbnail = $( '<div>' ).addClass( 'mw-widgets-stashedFileWidget-thumbnail' );
this.setPendingElement( this.$thumbnail );
this.$thumbContain = $( '<div>' )
.addClass( 'mw-widgets-stashedFileWidget-thumbnail-container' )
.append( this.$thumbnail, this.$info );
this.$element
.addClass( 'mw-widgets-stashedFileWidget' )
.append( this.$thumbContain );
this.updateUI();
};
OO.inheritClass( mw.widgets.StashedFileWidget, OO.ui.Widget );
OO.mixinClass( mw.widgets.StashedFileWidget, OO.ui.mixin.IconElement );
OO.mixinClass( mw.widgets.StashedFileWidget, OO.ui.mixin.LabelElement );
OO.mixinClass( mw.widgets.StashedFileWidget, OO.ui.mixin.PendingElement );
/**
* Get the current filekey.
*
* @return {string|null}
*/
mw.widgets.StashedFileWidget.prototype.getValue = function () {
return this.filekey;
};
/**
* Set the filekey.
*
* @param {string|null} filekey
*/
mw.widgets.StashedFileWidget.prototype.setValue = function ( filekey ) {
if ( filekey !== this.filekey ) {
this.filekey = filekey;
this.updateUI();
this.emit( 'change', this.filekey );
}
};
mw.widgets.StashedFileWidget.prototype.updateUI = function () {
var $label, $filetype;
if ( this.filekey ) {
this.$element.removeClass( 'mw-widgets-stashedFileWidget-empty' );
$label = $( [] );
$filetype = $( '<span>' )
.addClass( 'mw-widgets-stashedFileWidget-fileType' );
$label = $label.add(
$( '<span>' )
.addClass( 'mw-widgets-stashedFileWidget-filekey' )
.text( this.filekey )
).add( $filetype );
this.setLabel( $label );
this.pushPending();
this.loadAndGetImageUrl().done( function ( url, mime ) {
this.$thumbnail.css( 'background-image', 'url( ' + url + ' )' );
if ( mime ) {
$filetype.text( mime );
this.setLabel( $label );
}
}.bind( this ) ).fail( function () {
this.$thumbnail.append(
new OO.ui.IconWidget( {
icon: 'attachment',
classes: [ 'mw-widgets-stashedFileWidget-noThumbnail-icon' ]
} ).$element
);
}.bind( this ) ).always( function () {
this.popPending();
}.bind( this ) );
} else {
this.$element.addClass( 'mw-widgets-stashedFileWidget-empty' );
this.setLabel( '' );
}
};
mw.widgets.StashedFileWidget.prototype.loadAndGetImageUrl = function () {
var filekey = this.filekey;
if ( filekey ) {
return this.api.get( {
action: 'query',
prop: 'stashimageinfo',
siifilekey: filekey,
siiprop: [ 'size', 'url', 'mime' ],
siiurlwidth: 220
} ).then( function ( data ) {
var sii = data.query.stashimageinfo[ 0 ];
return $.Deferred().resolve( sii.thumburl, sii.mime );
} );
}
return $.Deferred().reject( 'No filekey' );
};
}( jQuery, mediaWiki, OO ) );
|
