Robmoen has uploaded a new change for review. https://gerrit.wikimedia.org/r/77248
Change subject: Create ve MWModal interstitial ...................................................................... Create ve MWModal interstitial For configured wikis, show MWModal on the first load of VisualEditor. Change-Id: I8e7c4dc2c63b36594378a543b9d66291395eebcf --- M VisualEditor.hooks.php M VisualEditor.i18n.php M VisualEditor.php M modules/ve-mw/init/targets/ve.init.mw.ViewPageTarget.js A modules/ve-mw/ui/dialogs/ve.ui.MWModalDialog.js M modules/ve-mw/ui/styles/ve.ui.MWDialog.css M modules/ve/ui/styles/ve.ui.Dialog.css M modules/ve/ui/ve.ui.Dialog.js 8 files changed, 108 insertions(+), 1 deletion(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/VisualEditor refs/changes/48/77248/1 diff --git a/VisualEditor.hooks.php b/VisualEditor.hooks.php index 7b1153a..c1813fd 100644 --- a/VisualEditor.hooks.php +++ b/VisualEditor.hooks.php @@ -122,7 +122,7 @@ * Adds extra variables to the page config. */ public static function onMakeGlobalVariablesScript( array &$vars, OutputPage $out ) { - global $wgStylePath, $wgContLang; + global $wgStylePath, $wgContLang, $wgVisualEditorShowBetaModal; $vars['wgVisualEditor'] = array( 'isPageWatched' => $out->getUser()->isWatched( $out->getTitle() ), // Same as in Linker.php @@ -131,6 +131,7 @@ ( $wgContLang->isRTL() ? '-rtl' : '' ) . '.png', 'pageLanguageCode' => $out->getTitle()->getPageLanguage()->getHtmlCode(), 'pageLanguageDir' => $out->getTitle()->getPageLanguage()->getDir(), + 'showBetaModal' => $wgVisualEditorShowBetaModal ); return true; diff --git a/VisualEditor.i18n.php b/VisualEditor.i18n.php index f4aacde..8d53369 100644 --- a/VisualEditor.i18n.php +++ b/VisualEditor.i18n.php @@ -86,6 +86,9 @@ 'visualeditor-dialog-transclusion-remove-param' => 'Remove parameter', 'visualeditor-dialog-transclusion-remove-template' => 'Remove template', 'visualeditor-dialog-transclusion-title' => 'Transclusion', + 'visualeditor-dialog-ve-modal-title' => 'VisualEditor is in beta', + 'visualeditor-dialog-ve-modal-content' => 'This is our new editor to make editing easier, VisualEditor. It\'s still in "beta", which means you might be unable to edit some parts of the page, or encounter issues that need to be fixed. You can keep using our old editor by clicking the "$1" tab instead.', + 'visualeditor-dialog-ve-modal-action-get-started' => 'Let\'s get started', 'visualeditor-dialogbutton-media-tooltip' => 'Media', 'visualeditor-dialogbutton-meta-tooltip' => 'Page settings', 'visualeditor-dialogbutton-reference-tooltip' => 'Reference', @@ -341,6 +344,9 @@ 'visualeditor-dialog-transclusion-remove-param' => 'Label for button that removes a parameter from a template', 'visualeditor-dialog-transclusion-remove-template' => 'Label for button that removes a template from a transclusion. {{Identical|Remove template}}', + 'visualeditor-dialog-ve-modal-title' => 'Title of the ve warning modal', + 'visualeditor-dialog-ve-modal-content' => 'Text explaining visual editor is in beta. Parameters: $1 is the text for #ca-edit', + 'visualeditor-dialog-ve-modal-action-get-started' => 'Text to close the dialog and continue using visual editor', 'visualeditor-dialog-transclusion-title' => '{{Identical|Transclusion}}', 'visualeditor-dialogbutton-media-tooltip' => '{{Identical|Media}}', 'visualeditor-dialogbutton-meta-tooltip' => '{{Identical|Page Settings}}', diff --git a/VisualEditor.php b/VisualEditor.php index bc68d57..bfc332d 100644 --- a/VisualEditor.php +++ b/VisualEditor.php @@ -491,6 +491,7 @@ 've/ui/dialogs/ve.ui.PagedDialog.js', 've-mw/ui/dialogs/ve.ui.MWMetaDialog.js', + 've-mw/ui/dialogs/ve.ui.MWModalDialog.js', 've-mw/ui/dialogs/ve.ui.MWMediaInsertDialog.js', 've-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js', 've-mw/ui/dialogs/ve.ui.MWTransclusionDialog.js', @@ -622,6 +623,9 @@ 'visualeditor-dialog-transclusion-remove-template', 'visualeditor-dialog-transclusion-title', 'visualeditor-dialog-transclusion-wikitext-label', + 'visualeditor-dialog-ve-modal-title', + 'visualeditor-dialog-ve-modal-content', + 'visualeditor-dialog-ve-modal-action-get-started', 'visualeditor-dialogbutton-media-tooltip', 'visualeditor-dialogbutton-meta-tooltip', 'visualeditor-dialogbutton-reference-tooltip', diff --git a/modules/ve-mw/init/targets/ve.init.mw.ViewPageTarget.js b/modules/ve-mw/init/targets/ve.init.mw.ViewPageTarget.js index d88678c..bf5c154 100644 --- a/modules/ve-mw/init/targets/ve.init.mw.ViewPageTarget.js +++ b/modules/ve-mw/init/targets/ve.init.mw.ViewPageTarget.js @@ -323,6 +323,9 @@ this.setupBeforeUnloadHandler(); this.$document[0].focus(); this.activating = false; + if ( mw.config.get( 'wgVisualEditor' ).showBetaModal ){ + this.showWarningModal(); + } mw.hook( 've.activationComplete' ).fire(); }, this ) ); } @@ -2230,6 +2233,19 @@ }; /** + * Show VE Warning modal if first load. + * + */ +ve.init.mw.ViewPageTarget.prototype.showWarningModal = function () { + if ( $.cookie( 've-warning-modal' ) !== null ) { + return ; + } + this.surface.getDialogs().open( 'mwModal' ); + $.cookie( 've-warning-modal', 1, { 'path': '/', 'expires': 365 } ); + +}; + +/** * Handle page show event. * * @method diff --git a/modules/ve-mw/ui/dialogs/ve.ui.MWModalDialog.js b/modules/ve-mw/ui/dialogs/ve.ui.MWModalDialog.js new file mode 100644 index 0000000..ff4d90f --- /dev/null +++ b/modules/ve-mw/ui/dialogs/ve.ui.MWModalDialog.js @@ -0,0 +1,64 @@ +/*! + * VisualEditor user interface MWModalDialog class. + * + * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +/** + * Dialog for inserting MediaWiki media objects. + * + * @class + * @extends ve.ui.MWDialog + * + * @constructor + * @param {ve.ui.Surface} surface + * @param {Object} [config] Config options + */ +ve.ui.MWModalDialog = function VeUiMWModalDialog( surface, config ) { + // Configuration initialization + config = ve.extendObject( {}, config, { 'small': true, 'footless': false } ); + + // Parent constructor + ve.ui.MWDialog.call( this, surface, config ); + // TODO: Modal needs generalized + this.contentMessage = ve.msg( 'visualeditor-dialog-ve-modal-content' ).replace( '$1', $( '#ca-edit' ).text() ); +}; + +/* Inheritance */ + +ve.inheritClass( ve.ui.MWModalDialog, ve.ui.MWDialog ); + +/* Static Properties */ + +ve.ui.MWModalDialog.static.titleMessage = 'visualeditor-dialog-ve-modal-title'; + +ve.ui.MWModalDialog.static.icon = 'window'; + +/* Methods */ + +/** */ +ve.ui.MWModalDialog.prototype.initialize = function () { + // Parent method + ve.ui.MWDialog.prototype.initialize.call( this ); + + // Properties + this.$content = this.$$( '<div>' ).addClass( 've-ui-mwModalDialog-content' ).text( this.contentMessage ); + + this.getStartedBtn = new ve.ui.ButtonWidget( { + '$$': this.$$, + 'label': ve.msg( 'visualeditor-dialog-ve-modal-action-get-started' ), + 'flags': ['primary'] + } ); + + // Events + this.getStartedBtn.connect( this, { 'click': [ 'close', 'close' ] } ); + + // Initialization + this.$body.append( this.$content ); + this.$foot.append( this.getStartedBtn.$ ); +}; + +/* Registration */ + +ve.ui.dialogFactory.register( 'mwModal', ve.ui.MWModalDialog ); diff --git a/modules/ve-mw/ui/styles/ve.ui.MWDialog.css b/modules/ve-mw/ui/styles/ve.ui.MWDialog.css index 63b1fff..69636b1 100644 --- a/modules/ve-mw/ui/styles/ve.ui.MWDialog.css +++ b/modules/ve-mw/ui/styles/ve.ui.MWDialog.css @@ -72,6 +72,12 @@ background: #F8F8F8; } +.ve-ui-mwModalDialog-content { + padding: 1.5em; + line-height: 1.25em; + font-size: 1.1em; +} + /* ve.ui.MWMediaInsertDialog */ .ve-ui-mwMediaInsertDialog-select { diff --git a/modules/ve/ui/styles/ve.ui.Dialog.css b/modules/ve/ui/styles/ve.ui.Dialog.css index 68049ce..a79f677 100644 --- a/modules/ve/ui/styles/ve.ui.Dialog.css +++ b/modules/ve/ui/styles/ve.ui.Dialog.css @@ -52,6 +52,12 @@ animation: ve-ui-zoom-in 250ms ease-in-out 0 1 normal; } +.ve-ui-dialog .ve-ui-window-frame.ve-ui-window-frame-small { + width: 600px; + min-height: 200px; + height: 200px; +} + .ve-ui-dialog-closing .ve-ui-window-frame { -webkit-animation: ve-ui-zoom-in 250ms ease-in-out 0 1 reverse; -moz-animation: ve-ui-zoom-in 250ms ease-in-out 0 1 reverse; diff --git a/modules/ve/ui/ve.ui.Dialog.js b/modules/ve/ui/ve.ui.Dialog.js index 5c0ca60..95e88e4 100644 --- a/modules/ve/ui/ve.ui.Dialog.js +++ b/modules/ve/ui/ve.ui.Dialog.js @@ -27,6 +27,7 @@ // Properties this.visible = false; this.footless = !!config.footless; + this.small = !!config.small; this.onWindowMouseWheelHandler = ve.bind( this.onWindowMouseWheel, this ); this.onDocumentKeyDownHandler = ve.bind( this.onDocumentKeyDown, this ); @@ -154,6 +155,9 @@ if ( this.footless ) { this.frame.$content.addClass( 've-ui-dialog-content-footless' ); } + if ( this.small ) { + this.$frame.addClass( 've-ui-window-frame-small' ); + } this.closeButton.$.addClass( 've-ui-window-closeButton' ); this.$head.append( this.closeButton.$ ); }; -- To view, visit https://gerrit.wikimedia.org/r/77248 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I8e7c4dc2c63b36594378a543b9d66291395eebcf Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/VisualEditor Gerrit-Branch: master Gerrit-Owner: Robmoen <rm...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits