[aur-dev] [PATCH v4 0/4] Add JavaScript method to edit comments
For a better user experience, enhance the comment edit form with a JavaScript method to edit comments on the same page, using a customized RPC interface. If JavaScript is not available, the page falls back to a standard web page, where a user can edit a comment. Marcel Korpel (4): pkg_comments.php: Merge two DIVs with same ID Split pkg_comment_form.php so the outer box is not always included aurjson.class.php: Add method get_comment_form() pkg_comments.php: Add JavaScript function to edit comments web/html/commentedit.php | 2 +- web/html/css/aurweb.css | 6 +++++ web/html/images/ajax-loader.gif | Bin 0 -> 723 bytes web/html/index.php | 4 +++ web/lib/aurjson.class.php | 51 +++++++++++++++++++++++++++++++++++++- web/lib/pkgbasefuncs.inc.php | 2 +- web/lib/pkgfuncs.inc.php | 2 +- web/template/pkg_comment_box.php | 4 +++ web/template/pkg_comment_form.php | 4 --- web/template/pkg_comments.php | 39 ++++++++++++++++++++++++++--- 10 files changed, 103 insertions(+), 11 deletions(-) create mode 100644 web/html/images/ajax-loader.gif create mode 100644 web/template/pkg_comment_box.php -- 2.4.6
Signed-off-by: Marcel Korpel <marcel.korpel@gmail.com> --- Change since v3: * Don't merge multiple statements in one PHP block. web/template/pkg_comments.php | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/web/template/pkg_comments.php b/web/template/pkg_comments.php index 26fddfd..bb006b9 100644 --- a/web/template/pkg_comments.php +++ b/web/template/pkg_comments.php @@ -63,12 +63,10 @@ $count = pkgbase_comments_count($base_id, $include_deleted); </p> </div> <?php endwhile; ?> -</div> <?php if ($count > 10 && !isset($_GET['comments'])): ?> -<div id="news"> <h3> <a href="<?= htmlentities(get_pkgbase_uri($pkgbase_name), ENT_QUOTES) . '?' . mkurl('comments=all') ?>" title="<?= __('View all comments') ?> (<?= $count ?>)"><?= __('All comments', $count) ?></a> </h3> -</div> <?php endif; ?> +</div> -- 2.4.6
For use in the new RPC interface to edit comments, the form shouldn't always print a header. Create a new template pkg_comment_box.php that prints form and box, change template pkg_comment_form.php to only print the form. Signed-off-by: Marcel Korpel <marcel.korpel@gmail.com> --- web/html/commentedit.php | 2 +- web/lib/pkgbasefuncs.inc.php | 2 +- web/lib/pkgfuncs.inc.php | 2 +- web/template/pkg_comment_box.php | 4 ++++ web/template/pkg_comment_form.php | 4 ---- 5 files changed, 7 insertions(+), 7 deletions(-) create mode 100644 web/template/pkg_comment_box.php diff --git a/web/html/commentedit.php b/web/html/commentedit.php index 83d86dd..2a0628e 100644 --- a/web/html/commentedit.php +++ b/web/html/commentedit.php @@ -17,5 +17,5 @@ if (!isset($base_id) || !has_credential(CRED_COMMENT_EDIT, array($user_id)) || i } html_header(__("Edit comment")); -include('pkg_comment_form.php'); +include('pkg_comment_box.php'); html_footer(AURWEB_VERSION); diff --git a/web/lib/pkgbasefuncs.inc.php b/web/lib/pkgbasefuncs.inc.php index 6057d10..3a72c24 100644 --- a/web/lib/pkgbasefuncs.inc.php +++ b/web/lib/pkgbasefuncs.inc.php @@ -187,7 +187,7 @@ function pkgbase_display_details($base_id, $row, $SID="") { include('pkgbase_details.php'); if ($SID) { - include('pkg_comment_form.php'); + include('pkg_comment_box.php'); } $limit = isset($_GET['comments']) ? 0 : 10; diff --git a/web/lib/pkgfuncs.inc.php b/web/lib/pkgfuncs.inc.php index de57c3e..d329eaf 100644 --- a/web/lib/pkgfuncs.inc.php +++ b/web/lib/pkgfuncs.inc.php @@ -481,7 +481,7 @@ function pkg_display_details($id=0, $row, $SID="") { include('pkg_details.php'); if ($SID) { - include('pkg_comment_form.php'); + include('pkg_comment_box.php'); } $limit = isset($_GET['comments']) ? 0 : 10; diff --git a/web/template/pkg_comment_box.php b/web/template/pkg_comment_box.php new file mode 100644 index 0000000..22f90d4 --- /dev/null +++ b/web/template/pkg_comment_box.php @@ -0,0 +1,4 @@ +<div id="generic-form" class="box"> + <h2><?= (isset($comment_id)) ? __('Edit comment for: %s', htmlspecialchars($pkgbase_name)) : __("Add Comment"); ?></h2> + <?php include 'pkg_comment_form.php' ?> +</div> diff --git a/web/template/pkg_comment_form.php b/web/template/pkg_comment_form.php index 16a92b1..7c16eb7 100644 --- a/web/template/pkg_comment_form.php +++ b/web/template/pkg_comment_form.php @@ -1,5 +1,3 @@ -<div id="generic-form" class="box"> - <h2><?= (isset($comment_id)) ? __('Edit comment for: %s', htmlspecialchars($pkgbase_name)) : __("Add Comment"); ?></h2> <form action="<?= get_pkgbase_uri($pkgbase_name) ?>" method="post"> <fieldset> <?php @@ -23,5 +21,3 @@ if (isset($_REQUEST['comment']) && check_token()) { </p> </fieldset> </form> -</div> - -- 2.4.6
This method will be used by the JavaScript comment editing and produces a form containing the comment. Signed-off-by: Marcel Korpel <marcel.korpel@gmail.com> --- Changes since v3: * Update commit message. * Improve JSDoc to match the other ones in aurjson.class.php. * Correct check for existence of query parameters and return decent error message (like in other cases of failures). * Move retrieval of query parameters in one block. * Improve formatting. web/lib/aurjson.class.php | 51 ++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 50 insertions(+), 1 deletion(-) diff --git a/web/lib/aurjson.class.php b/web/lib/aurjson.class.php index a272741..87d941e 100644 --- a/web/lib/aurjson.class.php +++ b/web/lib/aurjson.class.php @@ -14,7 +14,7 @@ class AurJSON { private $version = 1; private static $exposed_methods = array( 'search', 'info', 'multiinfo', 'msearch', 'suggest', - 'suggest-pkgbase' + 'suggest-pkgbase', 'get-comment-form' ); private static $exposed_fields = array( 'name', 'name-desc' @@ -477,5 +477,54 @@ class AurJSON { return json_encode($result_array); } + + /** + * Get the HTML markup of the comment form. + * + * @param string $comment_id ID of comment. + * @param string $base_id ID of package base. + * @param string $pkgbase_name Name of package base. + * + * @return string The JSON formatted response. + */ + private function get_comment_form($http_data) { + if (!isset($http_data['base_id']) || !isset($http_data['pkgbase_name'])) { + $output = array( + 'success' => 0, + 'error' => __('Parameters pkgbase_name and/or base_id are not defined.') + ); + return json_encode($output); + } + + $comment_id = intval($http_data['arg']); + $base_id = intval($http_data['base_id']); + $pkgbase_name = $http_data['pkgbase_name']; + + list($user_id, $comment) = comment_by_id($comment_id); + + if (!has_credential(CRED_COMMENT_EDIT, array($user_id))) { + $output = array( + 'success' => 0, + 'error' => __('You do not have the right to edit this comment.') + ); + return json_encode($output); + } elseif (is_null($comment)) { + $output = array( + 'success' => 0, + 'error' => __('Comment does not exist.') + ); + return json_encode($output); + } + + ob_start(); + include('pkg_comment_form.php'); + $html = ob_get_clean(); + $output = array( + 'success' => 1, + 'form' => $html + ); + + return json_encode($output); + } } -- 2.4.6
Signed-off-by: Marcel Korpel <marcel.korpel@gmail.com> --- web/html/css/aurweb.css | 6 ++++++ web/html/images/ajax-loader.gif | Bin 0 -> 723 bytes web/html/index.php | 4 ++++ web/template/pkg_comments.php | 35 +++++++++++++++++++++++++++++++++++ 4 files changed, 45 insertions(+) create mode 100644 web/html/images/ajax-loader.gif diff --git a/web/html/css/aurweb.css b/web/html/css/aurweb.css index b33726c..4fb256f 100644 --- a/web/html/css/aurweb.css +++ b/web/html/css/aurweb.css @@ -124,6 +124,12 @@ opacity: 1; } +.ajax-loader { + float: right; + position: relative; + top: 4px; +} + legend { padding: 1em 0; } diff --git a/web/html/images/ajax-loader.gif b/web/html/images/ajax-loader.gif new file mode 100644 index 0000000000000000000000000000000000000000..df07e7ec2076177c99b53d4d29a45f0db6b06a9a GIT binary patch literal 723 zcmZ?wbhEHb6ky<H_`<;O|NnpEv{esZe7gDQ-MdfU%`;a6x#5jFXKlVxKmX+MtIz$a zw&qPbv~b7uriG_ZU4Ic+v&}4Hb>Wo5uik&V|NP^(AHU+;_dI&}>C3lYM=m|vboAbp zdv88|`N04KivPL&TtkAL9RpmA^bD98f#Qn)q@0UV6H8K46v{J8G87WC5-W1@6I1ju z^V0Ge6o0aCasyTAfJ^{6l7UrML7^`tbKa5#T#rsMt#c4)wm4&2aJl;4?H%*^*q;ct zZ+YZ!f=91--8C-PwbPuinV^!8D8ZUAZ$+j|`^0?*ZXH_r=F;-s=Wq7D-W{Q@F^9F$ zTCh`s37bYUpw-=pI*&V4IF+P$l9wbc(l{x7eoOCbBdG(^nGZDWjsAGTTd?u$#mhT{ z{bn8t<<=6J=66T{n^C4fqn2>E3WhNCJ~l~G@x1uTreFAcY2|b4S-i`cPqf%2ZE*i3 z+J9zZu_cRC<?3tQyR_y8DPl9p2ofIGHbp#h37ovc<5E&ksO!lsv5&0c-cGyCn07cm z@P#sC?}=w8Sd-^@t-ShG3aj7DA;zc_#<r~3l(a1KW^3Z~jK_<%<<5%bQ+V^YX?vpJ z17^MHzAF7QOqk+z8O+R1FWC1Why$CG^dV+F0lH_!rgy7~WK@H;@IEkI|9iVk!F29# fT}NgWw#xj9(`7JWbB<iU1Zx11Y=$)`iGTqBb+`}S literal 0 HcmV?d00001 diff --git a/web/html/index.php b/web/html/index.php index 175a533..7068d76 100644 --- a/web/html/index.php +++ b/web/html/index.php @@ -160,6 +160,10 @@ if (!empty($tokens[1]) && '/' . $tokens[1] == get_pkg_route()) { header("Content-Type: text/css"); readfile("./$path"); break; + case "/images/ajax-loader.gif": + header("Content-Type: image/gif"); + readfile("./$path"); + break; case "/css/archnavbar/archlogo.gif": case "/images/new.png": header("Content-Type: image/png"); diff --git a/web/template/pkg_comments.php b/web/template/pkg_comments.php index bb006b9..21ce16f 100644 --- a/web/template/pkg_comments.php +++ b/web/template/pkg_comments.php @@ -70,3 +70,38 @@ $count = pkgbase_comments_count($base_id, $include_deleted); </h3> <?php endif; ?> </div> +<script> +$(document).ready(function() { + $('.edit-comment').click(function () { + var parent_element = this.parentElement, + parent_id = parent_element.id, + comment_id = parent_id.substr(parent_id.indexOf('-') + 1), + edit_form = $(parent_element).next(), + _this = $(this); + add_busy_indicator(_this); + $.getJSON('<?= get_uri('/rpc') ?>', { + type: 'get-comment-form', + arg: comment_id, + base_id: <?= intval($base_id) ?>, + pkgbase_name: <?= json_encode($pkgbase_name) ?> + }, function (data) { + remove_busy_indicator(_this); + if (data.success) { + edit_form.html(data.form); + edit_form.find('textarea').focus(); + } else { + alert(data.error); + } + }); + return false; + }); + + function add_busy_indicator(sibling) { + sibling.after('<img src="/images/ajax-loader.gif" class="ajax-loader" width="16" height="11" alt="Busy…" />'); + } + + function remove_busy_indicator(sibling) { + sibling.next().remove(); + } +}); +</script> -- 2.4.6
On Tue, 21 Jul 2015 at 22:53:53, Marcel Korpel wrote:
For a better user experience, enhance the comment edit form with a JavaScript method to edit comments on the same page, using a customized RPC interface. If JavaScript is not available, the page falls back to a standard web page, where a user can edit a comment. [...]
Merged the whole patch set (with some minor changes to patch 3/4) into the post-4.0.0 branch. Thanks for implementing this feature!
participants (2)
-
Lukas Fleischer
-
Marcel Korpel