5 * mw.ForeignStructuredUpload.BookletLayout encapsulates the process
6 * of uploading a file to MediaWiki using the mw.ForeignStructuredUpload model.
8 * var uploadDialog = new mw.Upload.Dialog( {
9 * bookletClass: mw.ForeignStructuredUpload.BookletLayout,
11 * targetHost: 'localhost:8080'
14 * var windowManager = new OO.ui.WindowManager();
15 * $( 'body' ).append( windowManager.$element );
16 * windowManager.addWindows( [ uploadDialog ] );
18 * @class mw.ForeignStructuredUpload.BookletLayout
19 * @uses mw.ForeignStructuredUpload
20 * @extends mw.Upload.BookletLayout
21 * @cfg {string} [targetHost] Used to set up the target wiki.
22 * If nothing is passed, the {@link mw.ForeignUpload#property-targetHost default} is used.
24 mw
.ForeignStructuredUpload
.BookletLayout = function ( config
) {
25 config
= config
|| {};
27 mw
.ForeignStructuredUpload
.BookletLayout
.parent
.call( this, config
);
29 this.targetHost
= config
.targetHost
;
34 OO
.inheritClass( mw
.ForeignStructuredUpload
.BookletLayout
, mw
.Upload
.BookletLayout
);
39 * Returns a {@link mw.ForeignStructuredUpload mw.ForeignStructuredUpload}
40 * with the {@link #cfg-targetHost targetHost} specified in config.
45 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.createUpload = function () {
46 return new mw
.ForeignStructuredUpload( this.targetHost
);
54 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.renderUploadForm = function () {
56 target
= mw
.config
.get( 'wgRemoteUploadTarget' ),
57 $ownWorkMessage
= $( '<p>' ).html(
58 mw
.message( 'foreign-structured-upload-form-label-own-work-message-' + target
).parse()
60 $notOwnWorkMessage
= $( '<div>' ).append(
62 mw
.message( 'foreign-structured-upload-form-label-not-own-work-message-' + target
).parse()
65 mw
.message( 'foreign-structured-upload-form-label-not-own-work-local-' + target
).parse()
70 this.selectFileWidget
= new OO
.ui
.SelectFileWidget();
71 this.messageLabel
= new OO
.ui
.LabelWidget( {
72 label
: $notOwnWorkMessage
74 this.ownWorkCheckbox
= new OO
.ui
.CheckboxInputWidget().on( 'change', function ( on
) {
76 layout
.messageLabel
.setLabel( $ownWorkMessage
);
78 layout
.messageLabel
.setLabel( $notOwnWorkMessage
);
82 fieldset
= new OO
.ui
.FieldsetLayout();
84 new OO
.ui
.FieldLayout( this.selectFileWidget
, {
86 label
: mw
.msg( 'upload-form-label-select-file' )
88 new OO
.ui
.FieldLayout( this.ownWorkCheckbox
, {
90 label
: mw
.msg( 'foreign-structured-upload-form-label-own-work' )
94 this.uploadForm
= new OO
.ui
.FormLayout( { items
: [ fieldset
] } );
97 this.selectFileWidget
.on( 'change', this.onUploadFormChange
.bind( this ) );
98 this.ownWorkCheckbox
.on( 'change', this.onUploadFormChange
.bind( this ) );
100 return this.uploadForm
;
106 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.onUploadFormChange = function () {
107 var file
= this.selectFileWidget
.getValue(),
108 ownWork
= this.ownWorkCheckbox
.isSelected(),
109 valid
= !!file
&& ownWork
;
110 this.emit( 'uploadValid', valid
);
116 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.renderInfoForm = function () {
119 this.filenameWidget
= new OO
.ui
.TextInputWidget( {
123 this.descriptionWidget
= new OO
.ui
.TextInputWidget( {
129 this.dateWidget
= new mw
.widgets
.DateInputWidget( {
130 $overlay
: this.$overlay
,
132 mustBeBefore
: moment().add( 1, 'day' ).locale( 'en' ).format( 'YYYY-MM-DD' ) // Tomorrow
134 this.categoriesWidget
= new mw
.widgets
.CategorySelector( {
135 $overlay
: this.$overlay
138 fieldset
= new OO
.ui
.FieldsetLayout( {
139 label
: mw
.msg( 'upload-form-label-infoform-title' )
142 new OO
.ui
.FieldLayout( this.filenameWidget
, {
143 label
: mw
.msg( 'upload-form-label-infoform-name' ),
146 new OO
.ui
.FieldLayout( this.categoriesWidget
, {
147 label
: mw
.msg( 'foreign-structured-upload-form-label-infoform-categories' ),
150 new OO
.ui
.FieldLayout( this.descriptionWidget
, {
151 label
: mw
.msg( 'upload-form-label-infoform-description' ),
154 new OO
.ui
.FieldLayout( this.dateWidget
, {
155 label
: mw
.msg( 'foreign-structured-upload-form-label-infoform-date' ),
159 this.infoForm
= new OO
.ui
.FormLayout( { items
: [ fieldset
] } );
162 this.filenameWidget
.on( 'change', this.onInfoFormChange
.bind( this ) );
163 this.descriptionWidget
.on( 'change', this.onInfoFormChange
.bind( this ) );
164 this.dateWidget
.on( 'change', this.onInfoFormChange
.bind( this ) );
166 return this.infoForm
;
172 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.onInfoFormChange = function () {
175 this.filenameWidget
.getValidity(),
176 this.descriptionWidget
.getValidity(),
177 this.dateWidget
.getValidity()
178 ).done( function () {
179 layout
.emit( 'infoValid', true );
180 } ).fail( function () {
181 layout
.emit( 'infoValid', false );
190 mw
.ForeignStructuredUpload
.BookletLayout
.prototype.getText = function () {
191 this.upload
.addDescription( 'en', this.descriptionWidget
.getValue() );
192 this.upload
.setDate( this.dateWidget
.getValue() );
193 this.upload
.addCategories( this.categoriesWidget
.getItemsData() );
194 return this.upload
.getText();
196 }( jQuery
, mediaWiki
) );