Mooeypoo has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/392717 )
Change subject: [EXPERIMENTAL] Using OOUI-PHP widgets with Flow
......................................................................
[EXPERIMENTAL] Using OOUI-PHP widgets with Flow
** DO NOT MERGE **
Testing/experimenting with light JS load + lazy loading
that is given from the OOUI-PHP side.
** DO NOT MERGE **
Change-Id: I1ac8569dff61eba4e079c4fb977417b236293cc6
---
M extension.json
M includes/OOUI/BaseUiWidget.php
A includes/OOUI/FlowButtonWidget.php
M includes/OOUI/PostWidget.php
M includes/OOUI/SimpleMenuWidget.php
M includes/View.php
M modules/flow-initialize.js
A modules/flow/experimental/initialization.js
M modules/styles/js.less
9 files changed, 81 insertions(+), 29 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Flow
refs/changes/17/392717/1
diff --git a/extension.json b/extension.json
index ca1555e..3a18f89 100644
--- a/extension.json
+++ b/extension.json
@@ -591,6 +591,11 @@
"styles/flow/widgets/experimental/mw.flow.ui.PostWidget.less"
]
},
+ "ext.flow.ooui.experimental.initial": {
+ "scripts": [
+ "flow/experimental/initialization.js"
+ ]
+ },
"ext.flow": {
"position": "top",
"styles": [
@@ -1256,6 +1261,7 @@
"Flow\\NotificationController":
"includes/Notifications/Controller.php",
"Flow\\NotificationsUserLocator":
"includes/Notifications/UserLocator.php",
"Flow\\OOUI\\BoardDescriptionWidget":
"includes/OOUI/BoardDescriptionWidget.php",
+ "Flow\\OOUI\\FlowButtonWidget":
"includes/OOUI/FlowButtonWidget.php",
"Flow\\OOUI\\BaseUiWidget": "includes/OOUI/BaseUiWidget.php",
"Flow\\OOUI\\SimpleMenuWidget":
"includes/OOUI/SimpleMenuWidget.php",
"Flow\\OOUI\\TopicWidget": "includes/OOUI/TopicWidget.php",
diff --git a/includes/OOUI/BaseUiWidget.php b/includes/OOUI/BaseUiWidget.php
index 837af34..d4334b9 100644
--- a/includes/OOUI/BaseUiWidget.php
+++ b/includes/OOUI/BaseUiWidget.php
@@ -40,11 +40,11 @@
return $tag;
}
- protected function getOnClickDeferredAction( $action ) {
+ protected function getOnClickDeferredAction( $name, $action ) {
$outputAction = json_encode( $action );
- return 'function () {' .
- 'window.mwSDInitActions = window.mwSDInitActions ||
[];' .
+ return 'window.mwSDInitActions = window.mwSDInitActions || [];'
.
'window.mwSDInitActions.push( [this,' . $outputAction .
']);' .
- '}';
+ 'console.log("clicked", mwSDInitActions);' .
+ 'return false;';
}
}
\ No newline at end of file
diff --git a/includes/OOUI/FlowButtonWidget.php
b/includes/OOUI/FlowButtonWidget.php
new file mode 100644
index 0000000..a7cc293
--- /dev/null
+++ b/includes/OOUI/FlowButtonWidget.php
@@ -0,0 +1,27 @@
+<?php
+
+namespace Flow\OOUI;
+
+/**
+ * Generic widget for buttons.
+ */
+class FlowButtonWidget extends \OOUI\ButtonWidget {
+ protected $name;
+
+ public function __construct( array $config = [] ) {
+ parent::__construct( array_merge( [ 'infusable' => true ],
$config ) );
+
+ if ( isset( $config['addOnClick' ] ) && $config['addOnClick' ]
) {
+ $this->button->setAttributes( [
+ 'onClick' => $this->getOnClickDeferredAction(
$name ),
+ ] );
+ }
+ }
+
+ protected function getOnClickDeferredAction( $name ) {
+ return 'window.mwSDInitActions = window.mwSDInitActions || [];'
.
+ 'window.mwSDInitActions.push( [this, "click"]);' .
+ 'console.log("clicked",window.mwSDInitActions);' .
+ 'return false;';
+ }
+}
\ No newline at end of file
diff --git a/includes/OOUI/PostWidget.php b/includes/OOUI/PostWidget.php
index 4fcf652..6910add 100644
--- a/includes/OOUI/PostWidget.php
+++ b/includes/OOUI/PostWidget.php
@@ -97,15 +97,17 @@
// the Thank extension. However, this
doesn't seem to be the
// way it's done right now, so we will
hard-code "thanks" here
// too for now
- new \OOUI\ButtonWidget( [
+ new FlowButtonWidget( [
'framed' => false,
'label' => 'Reply', // TODO:
i18n
'url' => '',
+ 'addOnClick' => true,
] ),
- new \OOUI\ButtonWidget( [
+ new FlowButtonWidget( [
'framed' => false,
'label' => 'Thank', // TODO:
i18n
'url' => '',
+ 'addOnClick' => true,
] ),
],
'classes' => [
'mw-flow-ui-postWidget-bottomMenu-actions' ]
diff --git a/includes/OOUI/SimpleMenuWidget.php
b/includes/OOUI/SimpleMenuWidget.php
index c96151e..e963134 100644
--- a/includes/OOUI/SimpleMenuWidget.php
+++ b/includes/OOUI/SimpleMenuWidget.php
@@ -63,19 +63,16 @@
$itemClasses[] = $sepClass;
}
- $button = new \OOUI\ButtonWidget( array_merge(
+ // Note: We're using the extended
Flow\OOUI\ButtonWidget
+ // so we can have access to adding an 'onClick'
method
+ $items[] = new FlowButtonWidget( array_merge(
[
'framed' => false,
'classes' => $itemClasses,
+ 'addOnClick' => true,
],
$itemData
) );
- $button->setAttributes( [
- 'data-name' => !empty( $itemData[
'name' ] ) ? $itemData[ 'name' ] : strtolower( str_replace( ' ', '_',
$itemData[ 'label' ] ) )
- 'onClick' =>
$this->getOnClickDeferredAction( 'click' ),
- ] );
-
- $items[] = $button;
$sepClass = '';
}
diff --git a/includes/View.php b/includes/View.php
index 6af4978..c723744 100644
--- a/includes/View.php
+++ b/includes/View.php
@@ -323,13 +323,14 @@
$action = $this->getRequest()->getVal( 'action', 'view'
);
$classes[] = "flow-action-$action";
-// var_dump( $apiResponse );
+if ( $testWidget ) {
+ $out->addModules( [ 'ext.flow.ooui.experimental.initial' ] );
+ $out->addModuleStyles( [ 'ext.flow.ooui.experimental.styles' ] );
-$out->addModuleStyles( [ 'ext.flow.ooui.experimental.styles' ] );
-
-$out->addHTML( Html::rawElement( 'hr' ) );
-$out->addHTML( $testWidget );
-$out->addHTML( Html::rawElement( 'hr' ) );
+ $out->addHTML( Html::rawElement( 'hr' ) );
+ $out->addHTML( $testWidget );
+ $out->addHTML( Html::rawElement( 'hr' ) );
+}
// Output the component, with the rendered blocks
inside it
$out->addHTML( Html::rawElement(
diff --git a/modules/flow-initialize.js b/modules/flow-initialize.js
index 7a83b5b..41d9565 100644
--- a/modules/flow-initialize.js
+++ b/modules/flow-initialize.js
@@ -17,7 +17,8 @@
$component: $component,
$board: $board
} );
-
+initializer.finishLoading();
+return;
// Set component
if ( !initializer.setComponentDom( $component ) ) {
initializer.finishLoading();
diff --git a/modules/flow/experimental/initialization.js
b/modules/flow/experimental/initialization.js
new file mode 100644
index 0000000..9fbea5e
--- /dev/null
+++ b/modules/flow/experimental/initialization.js
@@ -0,0 +1,18 @@
+( function ( $ ) {
+ /**
+ * First load initialization, take actions done on the interface
+ * and build the response as lazy-loaded modules
+ */
+ $( document ).ready( function () {
+ // var progressBar = OO.ui.infuse( $(
'.ve-init-mw-collabTarget-loading' ) ),
+
+ // $( '.mw-flow-ui-postWidget-bottomMenu-actions
.oo-ui-buttonWidget' ).each( function () {
+ // var button = OO.ui.infuse( $( this ) );
+ // console.log( 'infused', button );
+ // } );
+
+ // Go over initialization stack
+ window.mwSDInitActions = window.mwSDInitActions || [];
+ console.log( 'initialized', mwSDInitActions );
+ } );
+}( jQuery ) );
diff --git a/modules/styles/js.less b/modules/styles/js.less
index 749352c..69e48bb 100644
--- a/modules/styles/js.less
+++ b/modules/styles/js.less
@@ -6,15 +6,15 @@
.flow-action-view {
// Hide the component while it is loading if Javascript
// is enabled.
- .flow-ui-load-overlay {
- z-index: 101;
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- cursor: wait;
- }
+ // .flow-ui-load-overlay {
+ // z-index: 101;
+ // position: absolute;
+ // top: 0;
+ // left: 0;
+ // width: 100%;
+ // height: 100%;
+ // cursor: wait;
+ // }
.flow-component {
position: relative;
--
To view, visit https://gerrit.wikimedia.org/r/392717
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I1ac8569dff61eba4e079c4fb977417b236293cc6
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Flow
Gerrit-Branch: master
Gerrit-Owner: Mooeypoo <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
