2016-10-25 20:44:26 +00:00
|
|
|
/*!
|
2017-06-10 11:48:09 +00:00
|
|
|
* VisualEditor MediaWiki CollabTarget init.
|
2016-10-25 20:44:26 +00:00
|
|
|
*
|
2018-01-03 00:54:47 +00:00
|
|
|
* @copyright 2011-2018 VisualEditor Team and others; see AUTHORS.txt
|
2016-10-25 20:44:26 +00:00
|
|
|
* @license The MIT License (MIT); see LICENSE.txt
|
|
|
|
*/
|
|
|
|
|
|
|
|
( function () {
|
2017-05-20 19:22:44 +00:00
|
|
|
var target,
|
2016-10-25 20:44:26 +00:00
|
|
|
conf = mw.config.get( 'wgVisualEditorConfig' ),
|
2017-05-20 19:22:44 +00:00
|
|
|
pageName = mw.config.get( 'collabPadPageName' ) || '',
|
|
|
|
pageTitle = mw.Title.newFromText( pageName ),
|
2018-05-22 21:39:36 +00:00
|
|
|
modules = [ OO.ui.isMobile() ? 'ext.visualEditor.collabTarget.mobile' : 'ext.visualEditor.collabTarget.desktop' ]
|
2016-10-25 20:44:26 +00:00
|
|
|
// Add modules from $wgVisualEditorPluginModules
|
|
|
|
.concat( conf.pluginModules.filter( mw.loader.getState ) ),
|
2017-05-20 19:22:44 +00:00
|
|
|
loadingPromise = mw.loader.using( modules ),
|
|
|
|
progressBar = OO.ui.infuse( $( '.ve-init-mw-collabTarget-loading' ) ),
|
|
|
|
documentNameInput = OO.ui.infuse( $( '.ve-init-mw-collabTarget-nameInput' ) ),
|
2018-05-18 09:43:29 +00:00
|
|
|
documentNameButton = OO.ui.infuse( $( '.ve-init-mw-collabTarget-nameButton' ) ),
|
2018-06-23 18:29:33 +00:00
|
|
|
importInput = OO.ui.infuse( $( '.ve-init-mw-collabTarget-importInput' ), {
|
|
|
|
showImages: mw.config.get( 'wgVisualEditor' ).usePageImages,
|
|
|
|
showDescriptions: mw.config.get( 'wgVisualEditor' ).usePageDescriptions
|
|
|
|
} ),
|
|
|
|
importButton = OO.ui.infuse( $( '.ve-init-mw-collabTarget-importButton' ) ),
|
|
|
|
// Infuse the form last to avoid recursive infusion with no config
|
|
|
|
form = OO.ui.infuse( $( '.ve-init-mw-collabTarget-form' ) );
|
2016-10-25 20:44:26 +00:00
|
|
|
|
|
|
|
if ( !VisualEditorSupportCheck() ) {
|
|
|
|
// VE not supported - say something?
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2017-06-10 11:48:09 +00:00
|
|
|
function setTitle( title ) {
|
|
|
|
$( '#firstHeading' ).text( title );
|
|
|
|
document.title = title;
|
|
|
|
}
|
|
|
|
|
2018-05-21 14:20:25 +00:00
|
|
|
function showPage( title, importTitle ) {
|
2017-06-10 11:48:09 +00:00
|
|
|
setTitle( mw.msg( 'collabpad-doctitle', title.getPrefixedText() ) );
|
2017-05-20 19:22:44 +00:00
|
|
|
|
|
|
|
progressBar.toggle( true );
|
2018-05-18 09:43:29 +00:00
|
|
|
form.toggle( false );
|
2017-05-20 19:22:44 +00:00
|
|
|
|
|
|
|
loadingPromise.done( function () {
|
2018-05-21 14:20:25 +00:00
|
|
|
target = ve.init.mw.targetFactory.create( 'collab', title, conf.rebaserUrl, { importTitle: importTitle } );
|
2016-10-25 20:44:26 +00:00
|
|
|
|
|
|
|
$( 'body' ).addClass( 've-activated ve-active' );
|
|
|
|
|
|
|
|
$( '#content' ).append( target.$element );
|
|
|
|
|
|
|
|
target.transformPage();
|
|
|
|
$( '#firstHeading' ).addClass( 've-init-mw-desktopArticleTarget-uneditableContent' );
|
|
|
|
|
|
|
|
target.documentReady( ve.createDocumentFromHtml( '' ) );
|
2017-05-20 19:22:44 +00:00
|
|
|
} ).always( function () {
|
2018-05-18 09:43:29 +00:00
|
|
|
form.toggle( false );
|
2017-05-20 19:22:44 +00:00
|
|
|
progressBar.toggle( false );
|
2018-05-22 21:39:36 +00:00
|
|
|
} ).fail( function ( err ) {
|
|
|
|
mw.log.error( err );
|
2017-05-20 19:22:44 +00:00
|
|
|
// eslint-disable-next-line no-use-before-define
|
|
|
|
showForm();
|
2016-10-25 20:44:26 +00:00
|
|
|
} );
|
|
|
|
}
|
|
|
|
|
|
|
|
function showForm() {
|
2017-06-10 11:48:09 +00:00
|
|
|
setTitle( mw.msg( 'collabpad' ) );
|
2016-10-25 20:44:26 +00:00
|
|
|
|
2017-05-20 19:22:44 +00:00
|
|
|
if ( target ) {
|
|
|
|
$( '#firstHeading' ).removeClass( 've-init-mw-desktopArticleTarget-uneditableContent' );
|
|
|
|
target.restorePage();
|
|
|
|
target.destroy();
|
|
|
|
|
|
|
|
$( 'body' ).removeClass( 've-activated ve-active' );
|
|
|
|
}
|
|
|
|
|
|
|
|
progressBar.toggle( false );
|
2018-05-18 09:43:29 +00:00
|
|
|
form.toggle( true );
|
2017-05-20 19:22:44 +00:00
|
|
|
}
|
2016-10-25 20:44:26 +00:00
|
|
|
|
2018-05-21 14:20:25 +00:00
|
|
|
function loadTitle( title, importTitle ) {
|
2018-05-18 09:43:29 +00:00
|
|
|
var specialTitle = mw.Title.newFromText( 'Special:CollabPad/' + title.toString() );
|
|
|
|
if ( history.pushState ) {
|
|
|
|
// TODO: Handle popstate
|
2018-05-21 14:20:25 +00:00
|
|
|
history.pushState( { tag: 'collabTarget', title: title.toString() }, title.getMain(), specialTitle.getUrl() );
|
|
|
|
showPage( title, importTitle );
|
2018-05-18 09:43:29 +00:00
|
|
|
} else {
|
|
|
|
location.href = specialTitle.getUrl();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function getRandomTitle() {
|
|
|
|
return Math.random().toString( 36 ).slice( 2 );
|
|
|
|
}
|
|
|
|
|
|
|
|
function onNameChange() {
|
2017-09-14 12:42:36 +00:00
|
|
|
documentNameInput.getValidity().then( function () {
|
2018-05-18 09:43:29 +00:00
|
|
|
documentNameButton.setDisabled( false );
|
2017-09-14 12:42:36 +00:00
|
|
|
}, function () {
|
2018-05-18 09:43:29 +00:00
|
|
|
documentNameButton.setDisabled( true );
|
2017-09-14 12:42:36 +00:00
|
|
|
} );
|
|
|
|
}
|
|
|
|
|
2018-05-18 09:43:29 +00:00
|
|
|
function loadFromName() {
|
2017-05-20 19:22:44 +00:00
|
|
|
documentNameInput.getValidity().then( function () {
|
2018-05-18 09:43:29 +00:00
|
|
|
var title = mw.Title.newFromText(
|
|
|
|
documentNameInput.getValue().trim() || getRandomTitle()
|
|
|
|
);
|
2016-10-25 20:44:26 +00:00
|
|
|
|
|
|
|
if ( title ) {
|
2018-05-18 09:43:29 +00:00
|
|
|
loadTitle( title );
|
2016-10-25 20:44:26 +00:00
|
|
|
} else {
|
|
|
|
documentNameInput.focus();
|
|
|
|
}
|
2017-05-20 19:22:44 +00:00
|
|
|
} );
|
|
|
|
}
|
2016-10-25 20:44:26 +00:00
|
|
|
|
2017-05-20 19:22:44 +00:00
|
|
|
documentNameInput.setValidation( function ( value ) {
|
2018-01-08 15:32:15 +00:00
|
|
|
// Empty input will create a random document name, otherwise must be valid
|
|
|
|
return value === '' || !!mw.Title.newFromText( value );
|
2017-05-20 19:22:44 +00:00
|
|
|
} );
|
2018-05-18 09:43:29 +00:00
|
|
|
documentNameButton.setDisabled( false );
|
|
|
|
|
|
|
|
documentNameInput.on( 'change', onNameChange );
|
|
|
|
documentNameInput.on( 'enter', loadFromName );
|
|
|
|
documentNameButton.on( 'click', loadFromName );
|
|
|
|
onNameChange();
|
|
|
|
|
|
|
|
function onImportChange() {
|
2018-07-14 09:20:11 +00:00
|
|
|
importInput.getValidity().then( function () {
|
2018-05-18 09:43:29 +00:00
|
|
|
importButton.setDisabled( false );
|
|
|
|
}, function () {
|
|
|
|
importButton.setDisabled( true );
|
|
|
|
} );
|
|
|
|
}
|
|
|
|
|
|
|
|
function importTitle() {
|
|
|
|
importInput.getValidity().then( function () {
|
|
|
|
var title = mw.Title.newFromText( importInput.getValue().trim() );
|
|
|
|
|
|
|
|
if ( title ) {
|
2018-05-21 14:20:25 +00:00
|
|
|
loadTitle( mw.Title.newFromText( getRandomTitle() ), title );
|
2018-05-18 09:43:29 +00:00
|
|
|
} else {
|
|
|
|
documentNameInput.focus();
|
|
|
|
}
|
|
|
|
} );
|
|
|
|
}
|
2016-10-25 20:44:26 +00:00
|
|
|
|
2018-05-18 09:43:29 +00:00
|
|
|
importInput.setValidation( function ( value ) {
|
|
|
|
// TODO: Check page exists?
|
|
|
|
return !!mw.Title.newFromText( value );
|
|
|
|
} );
|
2018-07-14 09:20:11 +00:00
|
|
|
importInput.on( 'change', onImportChange );
|
2018-05-18 09:43:29 +00:00
|
|
|
importInput.on( 'enter', importTitle );
|
|
|
|
importButton.on( 'click', importTitle );
|
|
|
|
onImportChange();
|
2016-10-25 20:44:26 +00:00
|
|
|
|
|
|
|
if ( pageTitle ) {
|
|
|
|
showPage( pageTitle );
|
|
|
|
} else {
|
|
|
|
showForm();
|
|
|
|
}
|
2017-05-20 19:22:44 +00:00
|
|
|
|
|
|
|
// Tag current state
|
|
|
|
if ( history.replaceState ) {
|
|
|
|
history.replaceState( { tag: 'collabTarget', title: pageName }, document.title, location.href );
|
|
|
|
}
|
|
|
|
window.addEventListener( 'popstate', function ( e ) {
|
|
|
|
if ( e.state && e.state.tag === 'collabTarget' ) {
|
|
|
|
if ( e.state.title ) {
|
|
|
|
showPage( mw.Title.newFromText( e.state.title ) );
|
|
|
|
} else {
|
|
|
|
showForm();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} );
|
2016-10-25 20:44:26 +00:00
|
|
|
}() );
|