Mooeypoo has uploaded a new change for review.
https://gerrit.wikimedia.org/r/247017
Change subject: [WIP^n] Create a notifications widget demo
......................................................................
[WIP^n] Create a notifications widget demo
Change-Id: I8c3eba6d627c3f06d51d74fc9774e3fc2d02915d
---
M Echo.php
M Resources.php
M autoload.php
M i18n/en.json
M i18n/qqq.json
A includes/special/SpecialNotificationsDemo.php
A modules/demo/data/alert_new.json
A modules/demo/data/alert_old.json
A modules/demo/data/message_new.json
A modules/demo/data/message_old.json
A modules/demo/mw.echo.demo.init.js
A modules/demo/mw.echo.demo.js
A modules/demo/styles/mw.echo.demo.Page.less
A modules/demo/widgets/mw.echo.demo.Page.js
14 files changed, 277 insertions(+), 0 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Echo
refs/changes/17/247017/1
diff --git a/Echo.php b/Echo.php
index 0093324..0bd2d1a 100644
--- a/Echo.php
+++ b/Echo.php
@@ -62,6 +62,7 @@
// Special page
$wgSpecialPages['Notifications'] = 'SpecialNotifications';
+$wgSpecialPages['NotificationsDemo'] = 'SpecialNotificationsDemo';
// Housekeeping hooks
$wgHooks['LoadExtensionSchemaUpdates'][] =
'EchoHooks::onLoadExtensionSchemaUpdates';
diff --git a/Resources.php b/Resources.php
index 335c2f7..0dc3e9f 100644
--- a/Resources.php
+++ b/Resources.php
@@ -109,6 +109,27 @@
'targets' => array( 'desktop', 'mobile' ),
'dependencies' => array( 'ext.echo.logger' )
),
+ 'ext.echo.demo' => $echoResourceTemplate + array(
+ 'scripts' => array(
+ 'demo/mw.echo.demo.js',
+ 'demo/mw.echo.demo.init.js',
+ 'demo/widgets/mw.echo.demo.Page.js'
+ ),
+ 'styles' => array(
+ 'demo/styles/mw.echo.demo.Page.less'
+ ),
+ 'dependencies' => array(
+ 'ext.echo.ui'
+ ),
+ 'messages' => array(
+ 'echo-specialnotifications-demo',
+ 'echo-notification-alert-text-only',
+ 'echo-notification-message-text-only',
+ 'echo-demo-apiContent-oldFormat',
+ 'echo-demo-apiContent-newFormat'
+ ),
+ 'targets' => array( 'desktop' )
+ ),
// ext.echo.logger is registered in
EchoHooks::onResourceLoaderRegisterModules
'ext.echo.init' => $echoResourceTemplate + array(
'scripts' => array(
diff --git a/autoload.php b/autoload.php
index 41d95f4..7bfc6dc 100644
--- a/autoload.php
+++ b/autoload.php
@@ -99,5 +99,6 @@
'NotificationControllerTest' => __DIR__ .
'/tests/phpunit/controller/NotificationControllerTest.php',
'NotificationsTest' => __DIR__ . '/tests/NotificationsTest.php',
'SpecialNotifications' => __DIR__ .
'/includes/special/SpecialNotifications.php',
+ 'SpecialNotificationsDemo' => __DIR__ .
'/includes/special/SpecialNotificationsDemo.php',
'SuppressionMaintenanceTest' => __DIR__ .
'/tests/phpunit/maintenance/SupressionMaintenanceTest.php',
);
diff --git a/i18n/en.json b/i18n/en.json
index f4069d8..c32e3a6 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -45,6 +45,9 @@
"tooltip-pt-notifications-alert": "{{GENDER:|Your}} alerts",
"tooltip-pt-notifications-message": "{{GENDER:|Your}} messages",
"echo-specialpage": "Notifications",
+ "echo-specialnotifications-demo": "Notifications demo",
+ "echo-demo-apiContent-oldFormat": "Old notification format",
+ "echo-demo-apiContent-newFormat": "New notification format",
"echo-anon": "To receive notifications, [$1 create an account] or [$2
log in].",
"echo-none": "You have no notifications.",
"echo-more-info": "More info",
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 1e68f53..feb3b19 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -66,6 +66,9 @@
"tooltip-pt-notifications-alert": "This is used for the title
(mouseover text) of the alert notifications user tool.",
"tooltip-pt-notifications-message": "This is used for the title
(mouseover text) of the message notifications user tool.",
"echo-specialpage": "Special page title for
Special:Notifications.\n{{Identical|Notification}}",
+ "echo-specialnotifications-demo": "Special page title for
Special:NotificationsDemo",
+ "echo-demo-apiContent-oldFormat": "Title for the button that loads old
notification format for the Echo notifications demo.",
+ "echo-demo-apiContent-newFormat": "Title for the button that loads new
notification format for the Echo notifications demo.",
"echo-anon": "Error message shown to users who try to visit
[[Special:Notifications]] as an anon.\n\nParameters:\n* $1 - URL of signup
page, with returnto pointing to Special:Notifications\n* $2 - URL of login
page, with returnto pointing to Special:Notifications",
"echo-none": "Message shown to users who have no notifications. Also
shown in the overlay.",
"echo-more-info": "This is used for the title (mouseover text) of an
icon that links to a page with more information about the Echo
extension.\n{{Identical|More information}}",
diff --git a/includes/special/SpecialNotificationsDemo.php
b/includes/special/SpecialNotificationsDemo.php
new file mode 100644
index 0000000..26f2ff2
--- /dev/null
+++ b/includes/special/SpecialNotificationsDemo.php
@@ -0,0 +1,20 @@
+<?php
+
+class SpecialNotificationsDemo extends SpecialPage {
+ public function __construct() {
+ parent::__construct( 'NotificationsDemo' );
+ }
+
+ public function execute( $par ) {
+ $this->setHeaders();
+
+ $out = $this->getOutput();
+ $out->setPageTitle( $this->msg(
'echo-specialnotifications-demo' )->text() );
+
+ $out->addModules( 'ext.echo.demo' );
+
+ $out->addHTML(
+ Html::rawElement( 'div', array( 'class' =>
'mw-echo-demo-container' ) )
+ );
+ }
+}
diff --git a/modules/demo/data/alert_new.json b/modules/demo/data/alert_new.json
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/modules/demo/data/alert_new.json
diff --git a/modules/demo/data/alert_old.json b/modules/demo/data/alert_old.json
new file mode 100644
index 0000000..0967ef4
--- /dev/null
+++ b/modules/demo/data/alert_old.json
@@ -0,0 +1 @@
+{}
diff --git a/modules/demo/data/message_new.json
b/modules/demo/data/message_new.json
new file mode 100644
index 0000000..0967ef4
--- /dev/null
+++ b/modules/demo/data/message_new.json
@@ -0,0 +1 @@
+{}
diff --git a/modules/demo/data/message_old.json
b/modules/demo/data/message_old.json
new file mode 100644
index 0000000..0967ef4
--- /dev/null
+++ b/modules/demo/data/message_old.json
@@ -0,0 +1 @@
+{}
diff --git a/modules/demo/mw.echo.demo.init.js
b/modules/demo/mw.echo.demo.init.js
new file mode 100644
index 0000000..8644099
--- /dev/null
+++ b/modules/demo/mw.echo.demo.init.js
@@ -0,0 +1,6 @@
+( function ( mw, $ ) {
+ $( document ).ready( function () {
+ var demoPage = new mw.echo.demo.Page();
+ $( '.mw-echo-demo-container' ).append( demoPage.$element );
+ } );
+} )( mediaWiki, jQuery );
diff --git a/modules/demo/mw.echo.demo.js b/modules/demo/mw.echo.demo.js
new file mode 100644
index 0000000..c067fe5
--- /dev/null
+++ b/modules/demo/mw.echo.demo.js
@@ -0,0 +1,3 @@
+( function ( mw ) {
+ mw.echo.demo = {};
+} )( mediaWiki );
diff --git a/modules/demo/styles/mw.echo.demo.Page.less
b/modules/demo/styles/mw.echo.demo.Page.less
new file mode 100644
index 0000000..7e72858
--- /dev/null
+++ b/modules/demo/styles/mw.echo.demo.Page.less
@@ -0,0 +1,21 @@
+.mw-echo-demo-page {
+ line-height: 1.125em;
+ padding: 1em;
+
+ &-buttons {
+ margin-bottom: 1em;
+ }
+
+ &-wrapper {
+ position: relative;
+ float: left;
+ width: 450px;
+ margin-right: 5em;
+ }
+
+ &-header {
+ &-icon {
+ float: left;
+ }
+ }
+}
diff --git a/modules/demo/widgets/mw.echo.demo.Page.js
b/modules/demo/widgets/mw.echo.demo.Page.js
new file mode 100644
index 0000000..7c0fe1b
--- /dev/null
+++ b/modules/demo/widgets/mw.echo.demo.Page.js
@@ -0,0 +1,195 @@
+( function ( mw, $ ) {
+ /**
+ * Demo page for the Echo notifications widget
+ *
+ * @param {[type]} config Configuration object
+ * @cfg {string} [apiFormat='old'] The format to show notifications.
+ * 'old' format for backwards compatibility and 'new' format for the
+ * new notification formatter.
+ */
+ mw.echo.demo.Page = function MwEchoDemoPage( config ) {
+ var alertIconWidget = new OO.ui.IconWidget( {
+ classes: [ 'mw-echo-demo-page-header-icon' ],
+ icon: 'bell'
+ } ),
+ messageIconWidget = new OO.ui.IconWidget( {
+ classes: [ 'mw-echo-demo-page-header-icon' ],
+ icon: 'speechBubble'
+ } ),
+ alertLabel = new OO.ui.LabelWidget( {
+ classes: [ 'mw-echo-demo-page-header-label' ],
+ label: mw.msg(
'echo-notification-alert-text-only' )
+ } ),
+ messageLabel = new OO.ui.LabelWidget( {
+ classes: [ 'mw-echo-demo-page-header-label' ],
+ label: mw.msg(
'echo-notification-message-text-only' )
+ } ),
+ modelConfig = {
+ limit: 25,
+ userLang: mw.config.get( 'wgUserLanguage' ),
+ apiData: mw.echo.apiCallParams
+ };
+
+ config = config || {};
+
+ // Parent constructor
+ mw.echo.demo.Page.parent.call( this, config );
+ // Mixin constructors
+ OO.ui.mixin.PendingElement.call( this, config );
+
+ // Demo buttons
+ this.apiContentSelectWidget = new OO.ui.ButtonSelectWidget( {
+ classes: [ 'mw-echo-demo-page-apiContentButtonGroup' ],
+ items: [
+ new OO.ui.ButtonOptionWidget( {
+ data: 'old',
+ label: mw.msg(
'echo-demo-apiContent-oldFormat' )
+ } ),
+ new OO.ui.ButtonOptionWidget( {
+ data: 'new',
+ label: mw.msg(
'echo-demo-apiContent-newFormat' )
+ } )
+ ]
+ } );
+
+ // Default format
+ this.apiContentSelectWidget.selectItemByData( config.apiFormat
|| 'old' );
+
+ // Notifications model
+ this.msgModel = new mw.echo.dm.NotificationsModel( $.extend( {
+ type: 'message'
+ }, modelConfig ) );
+ this.alertModel = new mw.echo.dm.NotificationsModel( $.extend( {
+ type: 'alert'
+ }, modelConfig ) );
+
+ // Notifications widget
+ this.msgNotifsWidget = new mw.echo.ui.NotificationsWidget(
+ this.msgModel,
+ {
+ markReadWhenSeen: false
+ }
+ );
+ this.alertNotifsWidget = new mw.echo.ui.NotificationsWidget(
+ this.alertModel,
+ {
+ markReadWhenSeen: true
+ }
+ );
+
+ // Events
+ this.apiContentSelectWidget.connect( this, { choose:
'onApiContentSelectWidgetChoose' } );
+
+ // Initialization
+ this.loadApiFormat( config.apiFormat || 'old' );
+
+ this.$element
+ .addClass( 'mw-echo-demo-page' )
+ .append(
+ $( '<div>' )
+ .addClass( 'mw-echo-demo-page-buttons' )
+ .append(
+
this.apiContentSelectWidget.$element
+ ),
+ // We are mimicking the structure of the popup
to get the stylings
+ // to work out
+ $( '<div>' )
+ .addClass(
+
'mw-echo-ui-notificationBadgeButtonPopupWidget' +
+
'mw-echo-ui-notificationBadgeButtonPopupWidget-popup'
+ )
+ .append(
+ $( '<div>' )
+ .addClass(
'mw-echo-ui-notificationBadgeButtonPopupWidget' )
+ .append(
+ $( '<div>' )
+
.addClass( 'mw-echo-demo-page-wrapper oo-ui-popupWidget-popup' )
+ .append(
+
$( '<div>' )
+
.addClass( 'mw-echo-demo-page-wrapper-header oo-ui-popupWidget-head' )
+
.append(
+
alertIconWidget.$element,
+
alertLabel.$element
+
),
+
this.alertNotifsWidget.$element
+ )
+ ),
+ $( '<div>' )
+ .addClass(
'mw-echo-ui-notificationBadgeButtonPopupWidget' )
+ .append(
+ $( '<div>' )
+
.addClass( 'mw-echo-demo-page-wrapper oo-ui-popupWidget-popup' )
+ .append(
+
$( '<div>' )
+
.addClass( 'mw-echo-demo-page-wrapper-header oo-ui-popupWidget-head' )
+
.append(
+
messageIconWidget.$element,
+
messageLabel.$element
+
),
+
this.msgNotifsWidget.$element
+ )
+ )
+ ),
+ $( '<div>' )
+ .css( 'clear', 'both' )
+ );
+ };
+
+ /* Setup */
+ OO.inheritClass( mw.echo.demo.Page, OO.ui.Widget );
+ OO.mixinClass( mw.echo.demo.Page, OO.ui.mixin.PendingElement );
+
+ /**
+ * Respond to selecting an api content format
+ *
+ * @param {OO.ui.ButtonOptionWidget} item API content format button
+ */
+ mw.echo.demo.Page.prototype.onApiContentSelectWidgetChoose = function (
item ) {
+ var format = item && item.getData();
+
+ this.loadApiFormat( format );
+ };
+
+ /**
+ * Load an API format
+ *
+ * @param {string} format Format type
+ * @return {jQuery.Promise} A promise that resolves when the data is
loaded
+ */
+ mw.echo.demo.Page.prototype.loadApiFormat = function ( format ) {
+ var alertPromise, msgPromise,
+ demo = this,
+ path = mw.config.get( 'wgExtensionAssetsPath' ) +
'/Echo/modules/demo/data/' ,
+ promises = [];
+
+ format = format || 'old';
+
+ alertPromise = $.ajax( {
+ dataType: 'json',
+ url: path + 'alert_' + format + '.json'
+ } );
+
+ msgPromise = $.ajax( {
+ dataType: 'json',
+ url: path + 'message_' + format + '.json'
+ } );
+
+ this.msgModel.clearItems();
+ this.alertModel.clearItems();
+
+ this.pushPending();
+ this.apiContentSelectWidget.setDisabled( true );
+ promises = [
+ this.msgModel.fetchNotifications( msgPromise ),
+ this.alertModel.fetchNotifications( alertPromise )
+ ];
+
+ return $.when.apply( $, promises )
+ // TODO: Handle api failure
+ .always( function () {
+ demo.popPending();
+ demo.apiContentSelectWidget.setDisabled( false
);
+ } );
+ };
+
+} )( mediaWiki, jQuery );
--
To view, visit https://gerrit.wikimedia.org/r/247017
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I8c3eba6d627c3f06d51d74fc9774e3fc2d02915d
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Echo
Gerrit-Branch: master
Gerrit-Owner: Mooeypoo <mor...@gmail.com>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
