jenkins-bot has submitted this change and it was merged.
Change subject: Post a reply to a topic
......................................................................
Post a reply to a topic
Change-Id: Id174f5e21e570eba5486ae3bd393f4228fd50d48
---
M Flow.i18n.php
M modules/discussion/forms.js
M modules/discussion/styles/post.less
M modules/discussion/styles/topic.less
M modules/discussion/ui.js
M templates/topic.html.php
6 files changed, 175 insertions(+), 31 deletions(-)
Approvals:
Bsitu: Looks good to me, approved
Matthias Mullie: Looks good to me, but someone else must approve
jenkins-bot: Verified
diff --git a/Flow.i18n.php b/Flow.i18n.php
index ebdfc63..ae864f7 100644
--- a/Flow.i18n.php
+++ b/Flow.i18n.php
@@ -32,6 +32,8 @@
'flow-newtopic-save' => 'Add topic',
'flow-newtopic-start-placeholder' => 'Start a new topic',
+ 'flow-reply-topic-placeholder' => '{{GENDER:$1|Comment}} on "$2"',
+
'flow-reply-placeholder' => 'Click to {{GENDER:$1|reply}} to $1. Be
nice!',
'flow-reply-submit' => '{{GENDER:$1|Reply}}',
'flow-reply-link' => '{{GENDER:$1|Reply}}',
@@ -199,6 +201,9 @@
'flow-newtopic-header' => 'Unused at this time.',
'flow-newtopic-save' => 'Used as label for the Submit button.',
'flow-newtopic-start-placeholder' => 'Used as placeholder for the
"Topic" textarea.',
+ 'flow-reply-topic-placeholder' => 'Used as placeholder for the "reply
to this topic" textarea. Parameters:
+* $1 - username of the logged in user, can be used for GENDER,
+* $2 - topic title',
'flow-reply-placeholder' => 'Used as placeholder for the Content
textarea. Parameters:
* $1 - username',
'flow-reply-submit' => 'Used as label for the Submit button. Parameters:
diff --git a/modules/discussion/forms.js b/modules/discussion/forms.js
index a5e751e..5dac011 100644
--- a/modules/discussion/forms.js
+++ b/modules/discussion/forms.js
@@ -14,6 +14,11 @@
'.flow-newtopic-submit'
);
+ $container.find( 'form.flow-topic-reply-form' ).flow(
'setupEmptyDisabler',
+ ['.flow-topic-reply-content'],
+ '.flow-topic-reply-submit'
+ );
+
// Overload 'new topic' handler.
$container.flow( 'setupFormHandler',
'.flow-newtopic-submit',
@@ -78,6 +83,49 @@
}
);
+ // Overload 'topic reply' handler
+ $container.flow( 'setupFormHandler',
+ '.flow-topic-reply-submit',
+ mw.flow.api.reply,
+ function() {
+ var $form = $( this ).closest( '.flow-topic-reply-form'
),
+ workflowId = $( this ).flow(
'getTopicWorkflowId' ),
+ replyToId = $( this )
+ .closest( '.flow-topic-reply-container'
)
+ .data( 'post-id' ),
+ content = mw.flow.editor.getContent(
$form.find( '.flow-topic-reply-content' ) );
+
+ return [ workflowId, replyToId, content ];
+ },
+ function ( workflowId, replyTo, content ) {
+ return content;
+ },
+ function ( promise ) {
+ promise
+ .done( function ( output ) {
+ // Replies are currently sorted in
timestamp descending order.
+ // If we change it to ascending order,
then we need to append
+ // the new element to the end of the
container and remove the
+ // sliding-up effect
+ var $replyContainer = $( this )
+ .closest(
'.flow-topic-container' ).children(":first"),
+ $newRegion = $( output.rendered
)
+ .hide()
+ .insertAfter(
$replyContainer )
+ .trigger( 'flow_init' )
+ .slideDown();
+ $( 'html,body' ).animate( {
+ 'scrollTop': $( '#flow-topic-'
+ $( this ).closest( '.flow-topic-container' ).data( 'topic-id' ) ).offset().top
+ }, 500 );
+ // Reset the form
+ // @Todo - this works but doesn't seem
right
+ var $form = $( this ).closest(
'.flow-topic-reply-form' );
+ mw.flow.editor.destroy( $form.find(
'.flow-topic-reply-content' ) );
+ mw.flow.editor.load( $form.find(
'.flow-topic-reply-content' ) );
+ } );
+ }
+ );
+
// Overload 'edit post' link.
$container.find( '.flow-edit-post-link' )
.click( function ( e ) {
diff --git a/modules/discussion/styles/post.less
b/modules/discussion/styles/post.less
index 01d221f..90f7a3a 100644
--- a/modules/discussion/styles/post.less
+++ b/modules/discussion/styles/post.less
@@ -28,14 +28,9 @@
background-repeat: no-repeat;
}
- .flow-post:hover {
- .flow-edit-post-link {
-
.background-image-svg('../../base/images/edit_normal.svg',
'../../base/images/edit_normal.png');
-
- &:hover {
-
.background-image-svg('../../base/images/edit_hover.svg',
'../../base/images/edit_hover.png');
- }
- }
+ .flow-post-interaction {
+ // hide reply/thank buttons until post is hovered
+ display: none;
}
.flow-datestamp {
@@ -64,16 +59,6 @@
background-position: center;
background-size: 20px auto;
background-repeat: no-repeat;
- }
- }
-
- .flow-post:hover {
- .flow-actions-link {
-
.background-image-svg('../../base/images/flag_normal.svg',
'../../base/images/flag_normal.png');
-
- &:hover {
-
.background-image-svg('../../base/images/flag_hover.svg',
'../../base/images/flag_hover.png');
- }
}
}
@@ -115,23 +100,12 @@
}
.flow-thank-link {
- display: none;
padding-left: 46px;
.background-image-svg('../../base/images/thank.svg',
'../../base/images/thank.png');
background-position: 16px;
background-size: 20px auto;
background-repeat: no-repeat;
- }
-
- .flow-reply-link {
- display: none;
- }
-
- .flow-post:hover {
- .flow-reply-link, .flow-thank-link {
- display: inline-block;
- }
}
.flow-reply-form {
@@ -154,6 +128,28 @@
-moz-box-sizing: border-box;
font-family: sans-serif;
+ }
+ }
+
+ .flow-post:hover {
+ .flow-edit-post-link {
+
.background-image-svg('../../base/images/edit_normal.svg',
'../../base/images/edit_normal.png');
+
+ &:hover {
+
.background-image-svg('../../base/images/edit_hover.svg',
'../../base/images/edit_hover.png');
+ }
+ }
+
+ .flow-actions-link {
+
.background-image-svg('../../base/images/flag_normal.svg',
'../../base/images/flag_normal.png');
+
+ &:hover {
+
.background-image-svg('../../base/images/flag_hover.svg',
'../../base/images/flag_hover.png');
+ }
+ }
+
+ .flow-post-interaction {
+ display: block;
}
}
@@ -239,11 +235,14 @@
}
}
+// hacky way to flatten conversation;
+// make anything over 2 indentation levels appear on same level
.flow-post-container .flow-post-container .flow-post-container {
padding-left: 0px;
border-left: 0px transparent;
}
+// hacky way to not allow replies on an already too-deep level of indentation
.flow-post-container .flow-post-container .flow-reply-link {
display: none !important;
}
diff --git a/modules/discussion/styles/topic.less
b/modules/discussion/styles/topic.less
index cf5b924..dff87a2 100644
--- a/modules/discussion/styles/topic.less
+++ b/modules/discussion/styles/topic.less
@@ -187,3 +187,28 @@
}
}
}
+
+.flow-topic-reply-container {
+ padding-left: 22px;
+ margin-top: 20px;
+
+ .flow-creator {
+ font-weight: bold;
+ color: @post-title-color;
+ padding-bottom: 22px;
+ }
+
+ .flow-topic-reply-form {
+ margin-top: 22px;
+
+ .flow-post-form-controls {
+ text-align: right;
+ }
+ }
+
+ // until focussed, make the textarea look similar to a normal input
field
+ .flow-topic-reply-content:not(:focus) {
+ height: 34px;
+ padding-top: 6px;
+ }
+}
diff --git a/modules/discussion/ui.js b/modules/discussion/ui.js
index e863619..5dd2540 100644
--- a/modules/discussion/ui.js
+++ b/modules/discussion/ui.js
@@ -142,6 +142,29 @@
.after( ' ' )
.insertBefore( $container.find( '.flow-newtopic-form
input[type=submit]' ) );
+ // Hide reply button until user initiates reply (hidden in JS
because it needs to be there for non-JS users)
+ $container.find( '.flow-topic-reply-form
.flow-post-form-controls' ).hide();
+ // Set up topic reply form
+ $container.find( '.flow-topic-reply-content' ).click(
function() {
+ mw.flow.editor.load( $( this ) );
+
+ // display controls
+ $( this ).closest( '.flow-topic-reply-form' ).find(
'.flow-post-form-controls' ).show();
+ } );
+
+ // Set up the scroll to new topic reply form
+ $container.find( '.flow-topic-posts-meta .flow-post-number'
).click(
+ function( e ) {
+ var $hideElement = $( this ).closest(
'.flow-topic-container' ).children( '.flow-post-container' ), self = this;
+ e.stopPropagation();
+ $hideElement.slideDown( function() {
+ $( 'html,body' ).animate( {
+ 'scrollTop': $(
'#flow-topic-reply-' + $( self ).data( 'topic-id' ) ).offset().top
+ }, 500 );
+ } );
+ }
+ );
+
// Set up folding
$container.find( '.flow-titlebar' )
.click( function ( e ) {
diff --git a/templates/topic.html.php b/templates/topic.html.php
index 0349b00..56a0cf7 100644
--- a/templates/topic.html.php
+++ b/templates/topic.html.php
@@ -67,7 +67,7 @@
<ul class="flow-topic-posts-meta">
<li>@todo: participants</li>
- <li>@todo: # comments</li>
+ <li class="flow-post-number" data-topic-id="<?php echo
$topic->getId()->getHex() ?>">@todo: # comments</li>
</ul>
<?php
@@ -101,10 +101,54 @@
</span>
</p>
</div>
-
<?php
foreach( $root->getChildren() as $child ) {
echo $this->renderPost( $child, $block, $root );
}
+
+// Topic reply box
+echo Html::openElement( 'div', array(
+ 'class' => 'flow-topic-reply-container flow-post-container',
+ 'data-post-id' => $root->getRevisionId()->getHex(),
+ 'id' => 'flow-topic-reply-' . $topic->getId()->getHex()
+) );
+?>
+ <span class="flow-creator">
+ <span class="flow-creator-simple" style="display: inline">
+ <?php echo htmlspecialchars( $user->getName() ); ?>
+ </span>
+ <span class="flow-creator-full" style="display: none">
+ <?php echo $this->userToolLinks( $user->getId(),
$user->getName() ); ?>
+ </span>
+ </span>
+<?php
+ echo Html::openElement( 'form', array(
+ 'method' => 'POST',
+ 'action' => $this->generateUrl( $block->getWorkflow(), 'reply'
),
+ 'class' => 'flow-topic-reply-form',
+ ) ),
+ Html::element( 'input', array(
+ 'type' => 'hidden',
+ 'name' => $block->getName() . '[replyTo]',
+ 'value' => $topic->getId()->getHex(),
+ ) ),
+ Html::element( 'input', array(
+ 'type' => 'hidden',
+ 'name' => 'wpEditToken',
+ 'value' => $editToken,
+ ) ),
+ Html::textarea( $block->getName() . '[topic-reply-content]', '', array(
+ 'placeholder' => wfMessage( 'flow-reply-topic-placeholder',
$user->getName(), $title )->text(),
+ 'class' => 'flow-input mw-ui-input flow-topic-reply-content',
+ ) ),
+ Html::openElement( 'div', array( 'class' => 'flow-post-form-controls' )
),
+ Html::element( 'input', array(
+ 'type' => 'submit',
+ 'value' => wfMessage( 'flow-reply-submit',
$root->getCreatorName( $user ) )->text(),
+ 'class' => 'mw-ui-button mw-ui-constructive
flow-topic-reply-submit',
+ ) ),
+ Html::closeElement( 'div' ),
+ Html::closeElement( 'form' ),
+ Html::closeElement( 'div' );
?>
</div>
--
To view, visit https://gerrit.wikimedia.org/r/89142
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Id174f5e21e570eba5486ae3bd393f4228fd50d48
Gerrit-PatchSet: 4
Gerrit-Project: mediawiki/extensions/Flow
Gerrit-Branch: master
Gerrit-Owner: Bsitu <[email protected]>
Gerrit-Reviewer: Bsitu <[email protected]>
Gerrit-Reviewer: EBernhardson <[email protected]>
Gerrit-Reviewer: Matthias Mullie <[email protected]>
Gerrit-Reviewer: Werdna <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
