diff --git a/admin/comments.php b/admin/comments.php index 2cd6b313b..cb2f4a7d2 100644 --- a/admin/comments.php +++ b/admin/comments.php @@ -108,6 +108,7 @@ $tabsheet->assign(); $nb_total = 0; $nb_pending = 0; +$nb_validated = 0; $query = ' SELECT @@ -127,6 +128,8 @@ while ($row = pwg_db_fetch_assoc($result)) } } +$nb_validated = $nb_total - $nb_pending; + if (!isset($_GET['filter']) and $nb_pending > 0) { $page['filter'] = 'pending'; @@ -136,16 +139,50 @@ else $page['filter'] = 'all'; } -if (isset($_GET['filter']) and 'pending' == $_GET['filter']) +if (isset($_GET['filter']) and ('pending' == $_GET['filter'] or 'validated' == $_GET['filter'])) { $page['filter'] = $_GET['filter']; } +if (isset($_GET['status'])) +{ + $displayed_status = $_GET['status']; +} +else +{ + $displayed_status = 'all'; +} + +if (isset($_GET['author'])) +{ + $author = $_GET['author']; +} +else +{ + $author = 'all'; +} + +// by default, no filter by date is active +$start = $end = ""; + +if (isset($_GET['start_date'])){ + $start = $_GET['start_date']; +} + +if (isset($_GET['end_date'])){ + $end = $_GET['end_date']; +} + $template->assign( array( 'nb_total' => $nb_total, 'nb_pending' => $nb_pending, + 'nb_validated' => $nb_validated, 'filter' => $page['filter'], + 'displayed_status' => $displayed_status, + 'displayed_author' => $author, + 'START' => $start, + 'END' => $end, ) ); @@ -155,6 +192,10 @@ if ('pending' == $page['filter']) { $where_clauses[] = 'validated=\'false\''; } +if ('validated' == $page['filter']) +{ + $where_clauses[] = 'validated=\'true\''; +} $query = ' SELECT @@ -163,6 +204,7 @@ SELECT c.date, c.author, '.$conf['user_fields']['username'].' AS username, + ui.status, c.content, i.path, i.representative_ext, @@ -173,6 +215,8 @@ SELECT ON i.id = c.image_id LEFT JOIN '.USERS_TABLE.' AS u ON u.'.$conf['user_fields']['id'].' = c.author_id + LEFT JOIN '.USER_INFOS_TABLE.' AS ui + ON ui.user_id = c.author_id WHERE '.implode(' AND ', $where_clauses).' ORDER BY c.date DESC LIMIT '.$page['start'].', '.$conf['comments_page_nb_comments'].' @@ -202,10 +246,12 @@ while ($row = pwg_db_fetch_assoc($result)) 'ID' => $row['id'], 'TN_SRC' => $thumb, 'AUTHOR' => trigger_change('render_comment_author', $author_name), + 'AUTHOR_STATUS' => $row['status'], 'DATE' => format_date($row['date'], array('day_name','day','month','year','time')), 'CONTENT' => trigger_change('render_comment_content',$row['content']), 'IS_PENDING' => ('false' == $row['validated']), 'IP' => $row['anonymous_id'], + 'NUMERICAL_DATE' => $row['date'], ) ); diff --git a/admin/themes/default/template/comments.tpl b/admin/themes/default/template/comments.tpl index 9fda8f142..8ff26389b 100644 --- a/admin/themes/default/template/comments.tpl +++ b/admin/themes/default/template/comments.tpl @@ -1,9 +1,12 @@ +{combine_script id='jquery.ui.slider' require='jquery.ui' load='header' path='themes/default/js/ui/minified/jquery.ui.slider.min.js'} +{combine_css path="themes/default/js/ui/theme/jquery.ui.slider.css"} + {footer_script} jQuery(document).ready(function(){ $("h1").append(""+{$nb_total}+""); function highlighComments() { - jQuery(".checkComment").each(function() { + jQuery(".comment").each(function() { var parent = jQuery(this).parent('tr'); if (jQuery(this).children("input[type=checkbox]").is(':checked')) { jQuery(parent).addClass('selectedComment'); @@ -14,6 +17,103 @@ jQuery(document).ready(function(){ }); } + if ("{$filter}" == "pending"){ + $("#seeWaiting").prop('checked', true); + } + if ("{$filter}" == "validated"){ + $("#seeValidated").prop('checked', true); + } + + $("#seeAll").on("change", function(){ + if ($("#seeAll").prop('checked') == true){ + window.location.replace("{$F_ACTION}&filter=all&status={$displayed_status}&author={$displayed_author}&start_date={$START}&end_date={$END}"); + } + }); + + $("#seeWaiting").on("change", function(){ + if ($("#seeWaiting").prop('checked') == true){ + window.location.replace("{$F_ACTION}&filter=pending&status={$displayed_status}&author={$displayed_author}&start_date={$START}&end_date={$END}"); + } + }); + + $("#seeValidated").on("change", function(){ + if ($("#seeValidated").prop('checked') == true){ + window.location.replace("{$F_ACTION}&filter=validated&status={$displayed_status}&author={$displayed_author}&start_date={$START}&end_date={$END}"); + } + }); + + $("#status_filter").on("change", function(){ + let location = "{$F_ACTION}&filter={$filter}&status=" + $("#status_filter").find(":selected").val().toString() + "&author={$displayed_author}&start_date={$START}&end_date={$END}"; + window.location.replace(location); + }); + + $("#status_filter").val("{$displayed_status}"); + + $("#author_filter").on("change", function(){ + let location = "{$F_ACTION}&filter={$filter}&status={$displayed_status}&author=" + $("#author_filter").find(":selected").val().toString() + "&start_date={$START}&end_date={$END}"; + window.location.replace(location); + }); + + $("#author_filter").val("{$displayed_author}"); + + $("#start_unset").on("click", function(){ + $("#start_date").val(""); + let location = "{$F_ACTION}&filter={$filter}&status={$displayed_status}&author={$displayed_author}&start_date=&end_date={$END}"; + window.location.replace(location); + }); + + $("#start_date").on("focus", function(){ + $(this).data('previous', $(this).val()); + }); + + $("#start_date").val("{$START}".replaceAll("_", "-")); + + $("#start_date").on("change", function(){ + if ($("#end_date").val() != "") + { + var previous = $(this).data('previous'); + var current = new Date($(this).val()); + var max = new Date($("#end_date").val()); + if (current > max){ + $(this).val(previous); + $(this).data('previous', $(this).val()); + return + } + } + $(this).data('previous', $(this).val()); + let location = "{$F_ACTION}&filter={$filter}&status={$displayed_status}&author={$displayed_author}&start_date=" + $(this).val().replaceAll("-", "_") + "&end_date={$END}"; + window.location.replace(location); + }); + + $("#end_unset").on("click", function(){ + $("#end_date").val(""); + let location = "{$F_ACTION}&filter={$filter}&status={$displayed_status}&author={$displayed_author}&start_date={$START}&end_date="; + window.location.replace(location); + }); + + $("#end_date").on("focus", function(){ + $(this).data('previous', $(this).val()); + }); + + $("#end_date").val("{$END}".replaceAll("_", "-")); + + $("#end_date").on("change", function(){ + if ($("#start_date").val() != "") + { + var previous = $(this).data('previous'); + var current = new Date($(this).val()); + var min = new Date($("#start_date").val()); + if (current < min){ + $(this).val(previous); + $(this).data('previous', $(this).val()); + return + } + } + $(this).data('previous', $(this).val()); + let location = "{$F_ACTION}&filter={$filter}&status={$displayed_status}&author={$displayed_author}&start_date={$START}&end_date=" + $(this).val().replaceAll("-", "_"); + window.location.replace(location); + }); + jQuery(".checkComment").click(function(event) { var checkbox = jQuery(this).children("input[type=checkbox]"); if (event.target.type !== 'checkbox') { @@ -23,62 +123,271 @@ jQuery(document).ready(function(){ }); jQuery("#commentSelectAll").click(function () { - jQuery(".checkComment input[type=checkbox]").prop('checked', true); + $(".comment-select-checkbox").prop('checked', true); + $(".comment-select-checkbox").trigger("change"); highlighComments(); return false; }); jQuery("#commentSelectNone").click(function () { - jQuery(".checkComment input[type=checkbox]").prop('checked', false); + $(".comment-select-checkbox").prop('checked', false); + $(".comment-select-checkbox").trigger("change"); highlighComments(); return false; }); jQuery("#commentSelectInvert").click(function () { - jQuery(".checkComment input[type=checkbox]").each(function() { + $(".comment-select-checkbox").each(function() { jQuery(this).prop('checked', !$(this).prop('checked')); }); + $(".comment-select-checkbox").trigger("change"); highlighComments(); return false; }); + $(".comment-select-checkbox").on("change", function(event) { + if ($(this).prop("checked")){ + $(this).removeClass("icon-circle-empty") + $(this).addClass("icon-ok-circled") + } + else { + $(this).removeClass("icon-ok-circled") + $(this).addClass("icon-circle-empty") + } + }); + + $("#toggleSelectionMode").on("click", function() { + if ($(".comment-select-checkbox").css("visibility") == "visible") { + $(".comment-buttons-container").css("visibility", "visible"); + $(".comment-select-checkbox").css("visibility", "hidden"); + $(".comment-selection-content").hide(); + $(".comment-container").css("margin-inline-end", "0em") + $("#advanced-filter-menu").css("margin-inline", "23px 10px") + + $(".comment-select-checkbox").prop('checked', false); + $(".comment-select-checkbox").trigger("change"); + highlighComments(); + } + else { + $(".comment-select-checkbox").css("visibility", "visible"); + $(".comment-buttons-container").css("visibility", "hidden"); + $(".comment-selection-content").css("display", "flex") + $(".comment-container").css("margin-inline-end", "5em") + $("#advanced-filter-menu").css("margin-inline", "23px 270px") + } + }) + + $(".advanced-filter-btn").on("click", function() { + if ($("#advanced-filter-menu").css("display") == "none") { + $("#advanced-filter-menu").css("display", "flex") + $("#advanced-filter-menu").css("margin-bottom", "1em") + $(".commentFilter").css("margin-bottom", "0.2em") + $(".commentFilter .advanced-filter-btn").css("height", "100%") + $(".commentFilter .advanced-filter-btn").css("height", "100%") + } + else { + $("#advanced-filter-menu").css("display", "none") + $("#advanced-filter-menu").css("margin-bottom", "0.2em") + $(".commentFilter").css("margin-bottom", "1em") + $(".commentFilter .advanced-filter-btn").css("height", "20px") + } + }) + + if ("{$displayed_status}" != "all" || "{$displayed_author}" != "all" || "{$START}" != "" || "{$END}" != ""){ + $(".advanced-filter-btn").trigger( "click" ); + } + + $(".delete-comment, #commentDeleteSelected").on("click", function() { + jQuery(this).parent().parent().children("input[type=checkbox]").prop('checked', true); + $("#pendingComments").trigger("submit") + }) + + $(".approve-comment, #commentValidateSelected").on("click", function() { + jQuery(this).parent().parent().children("input[type=checkbox]").prop('checked', true); + $("#pendingComments").trigger("submit") + }) + + $("#commentValidateSelected, #commentDeleteSelected").on("click", function() { + $("#pendingComments").trigger("submit") + }) + }); {/footer_script}
- {'All'|@translate} ({$nb_total}) - | {'Waiting'|@translate} ({$nb_pending}) -{if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} + +
+ + + +
+ + {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} + +
+
+ {'Filters'|@translate} + +
+ +
+ + + +
+ + +
+ + Mode sélection +
+ +
+ +
+ + - {if !empty($comments) } -
+ + + - +
{foreach from=$comments item=comment name=comment} -
- - - + {/if} + {/if} + {/if} + {/if} {/foreach} -
- - -
+ {if $displayed_status == "all" or $displayed_status == $comment.AUTHOR_STATUS} + {if $displayed_author == "all" or $comment.AUTHOR == $displayed_author} + {if $START == "" or (date_timestamp_get(DateTime::createFromFormat("Y-m-d H:i:s", $comment.NUMERICAL_DATE))) >= (date_timestamp_get(DateTime::createFromFormat("Y_m_d", $START)))} + {if $END == "" or (date_timestamp_get(DateTime::createFromFormat("Y-m-d H:i:s", $comment.NUMERICAL_DATE))) <= (date_timestamp_get(DateTime::createFromFormat("Y_m_d", $END)))} +
+ -

{if $comment.IS_PENDING}{'Waiting'|@translate} - {/if}{if !empty($comment.IP)}{$comment.IP} - {/if}{$comment.AUTHOR} - {$comment.DATE}

-
{$comment.CONTENT}
+ +
+ +
" {$comment.CONTENT} "
+ + {if $comment.AUTHOR_STATUS == "webmaster"} + + {elseif $comment.AUTHOR_STATUS == "admin"} + + {elseif $comment.AUTHOR_STATUS == "normal"} + + {elseif $comment.AUTHOR_STATUS == "guest"} + + {/if} + {$comment.AUTHOR} + +

{$comment.DATE}

+ +
+ {if $comment.IS_PENDING} + + {/if} + +
+
+
-
+ + + +
+ + + {'Select:'|@translate} {$nb_total} + + + {'All'|@translate} + {'Invert'|@translate} +

- {'Select:'|@translate} - {'All'|@translate}, - {'None'|@translate}, - {'Invert'|@translate} + {'Action:'|@translate}

+ - -
- +
{/if} diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css index 6041109d7..a3ca37c07 100644 --- a/admin/themes/default/theme.css +++ b/admin/themes/default/theme.css @@ -26,8 +26,7 @@ ul.categoryActions { margin: 0 2px; width: auto; list-style-position:outside; .content div.comment blockquote { margin-right: 0.5em; overflow: visible; /*avoid a very strange margin behaviour (all browsers) */ } -.commentFilterSelected {color:#666;text-decoration:underline;} -.comment .pendingFlag {font-style:italic;color:red;} +.comment .pendingFlag {font-style:italic;color:red;margin-left: 0.5em;} /* not used but should be */ #thePopuphelpPage .content { margin: 1em; } @@ -547,6 +546,265 @@ LI.menuLi { transform: translate(calc(-50% - 4px), -50%); } +.comment-container{ + display: flex; + flex-flow: row wrap; + align-items: center; + + gap: 1.5em; +} + +.commentFilter{ + margin-bottom: 1em; + padding-inline: 1.5em; + display: flex; + flex-direction: row; +} + +.commentFilter .commentFilter { + margin-inline-start: auto; + gap: 1em; +} + +.commentFilter .advanced-filter-btn{ + height: 20px; + padding: 10px 10px 5px 10px; + margin: 4px; + position: relative; + left: 3.17em; +} + +.advanced-filter-date{ + display: flex; + flex-direction: column; +} + +.advanced-filter-date div { + flex: 1; +} + +.advanced-filter-date div input{ + height: 100%; + width: 74%; + border-color: #D4D4D4; + padding-inline: 1em; +} + +.commentFilter .userActions{ + align-self: center; + z-index: 99; +} + +.commentFilter .pluginTypeFilter{ + transform: none; + position: unset; + margin: 4px; +} + +.commentFilter #search-comment{ + padding-inline-end: 4em; +} + +#search-comment .search-icon{ + position: relative; + left: 37px; + top: 2px; +} + +.comment-selection-content{ + background-color: rgb(250, 250, 250); + border-left: 1px solid rgb(230, 230, 230); + position: absolute; + right: 0px; + width: 223px; + min-height: calc(87% - 171px); + top: 169.5px; + z-index: 10; + padding: 7em 1em 0em 1em; + display: none; + flex-direction: column; +} + +.selectButton { + text-align: center; + background-color: #f0f0f0; + padding: 10px; + color: #777; + font-weight: bold; + margin: 4px; + border-radius: 5px; +} + +.selectButton:hover { + background-color: #ddd; + color: #3A3A3A; + text-decoration: none !important; +} + +.selectButton2 { + text-align: center; + padding: 10px; + color: #3C3C3C; + font-weight: bold; + margin: 4px; + border: solid; + border-width: 1px; + border-color: #E7E7E7; +} + +.selectButton2:hover { + background-color: #ddd; + color: #000000; + text-decoration: none !important; +} + +.comment-form{ + display : flex; +} + +.comment-box-validated, .comment-box-validated:focus{ + border-color: #FFC17E !important; +} + +.comment-box, .comment-box:focus{ + background-color: #FAFAFA; + + display: flex; + flex-direction: row; + align-items: center; + + box-shadow: rgba(0, 0, 0, 0.14) 0px 2px 5px; + + border-radius: 4px; + border-left: solid; + border-color: #999999; + border-width: 6px; + + width: 29.8em; + height: 11.7em; + + padding: 0em 1em 0em 0em; +} + +.comment-box a img{ + object-fit: cover; + height: 11.7em; + width: 11.7em; + margin-top: 0.3em; + margin-right: 3%; +} + +.comment-box .comment{ + display: flex; + flex-direction: column; + height: 100%; + + color: #3C3C3C; + font-weight: 600; +} + +.comment-box .comment blockquote{ + align-self: flex-start; + font-style: italic; + margin : -1em 2% 0% 0%; + align-self: flex-start; + min-height: 0em; +} + +.comment-box .comment strong, .comment-box .comment p{ + align-self: flex-end; + text-align: right; + margin: 0% 2% 0% 0%; +} + +.badge-grey{ + padding-inline : 5px; + color: #898989; + background-color: #DBDBDB; + border-radius: 20px; +} +.badge-red{ + color: #FF5252; + background-color: #FFCFCF; + border-radius: 20px; +} +.badge-guest{ + color: #2883C3; + background-color: #CFEBFF; + border-radius: 20px; +} +.badge-user{ + color: #FFA646; + background-color: #FFE9CF; + border-radius: 20px; +} +.badge-admin{ + color: #896AF3; + background-color: #E0DAF4; + border-radius: 20px; +} +.badge-main-user{ + color: #896AF3; + background-color: #E0DAF4; + border-radius: 20px; +} + +.comment-select-checkbox, .comment-select-checkbox:focus{ + appearance: none; + visibility: hidden; + outline: none; + + position: relative; + top: 5px; + right: -85%; + width: 7%; + height: 10%; + color: #FFA646; + font-size: 2em; + background-color: #FAFAFA; +} + +.comment div { + text-align: end; + min-height: 18%; + min-width: 100%; + margin-top: auto; + margin-bottom: 0.8em; +} + +.comment-buttons-container{ + visibility: visible; +} + +.delete-comment{ + border-width: 0px; + border-radius: 6px; + background-color: #EEEEEE; + color: #3C3C3C; + height: 100%; + font-weight: bold; + font-size: 12px; +} +.delete-comment:hover{ + cursor: pointer; + text-decoration: none; +} + +.approve-comment{ + border-width: 0px; + border-radius: 6px; + background-color: #FFC17E; + color : #3C3C3C; + height: 100%; + font-size: 12px; + font-weight: bold; + margin-right: 3%; +} +.approve-comment:hover{ + cursor: pointer; + text-decoration: none; +} + .cat-modify-content { display: grid; grid-template-rows: 70px 380px; @@ -812,7 +1070,7 @@ LI.menuLi { /* Search bar */ .search-input{ - padding: 10px; + padding: 10px 10px 6px 10px; box-shadow: 0px 2px #00000024; border: none; background-color: #fafafa !important; @@ -2570,6 +2828,10 @@ div.jGrowl div.jGrowl-notification{ margin-left: 5px; } +.advanced-filter-item{ + text-align: left; +} + .advanced-filter-revision-date .advanced-filter-item-label { display: inline !important; @@ -4859,7 +5121,6 @@ a#showPermissions:hover {text-decoration: none;} margin-left: 25px; } -.commentFilter {text-align:left;margin:5px 1em;} FORM#categoryOrdering p.albumTitle {margin:0; margin-left: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-bottom: 4px;} FORM#categoryOrdering p.albumTitle a {font-size: 14px; font-weight: 600;} @@ -6575,6 +6836,23 @@ fieldset#environment legend i[class*="icon-"] { color:#493C21; } +.buttonSecondary{ + font-size:12px; + border:none; + padding:13px 20px; + margin-left:0; font-weight: bold; transition: all 125ms ease-out; + color:#3C3C3C; + background-color:#ECECEC; +} + +.buttonSecondary:hover{ + cursor: pointer; + background-color: #FFA646; + text-decoration: none; + color:#3C3C3C; +} + + #cboxLoadedContent input[type="submit"] {margin-bottom: 20px; float: none;} #permissions, #uploadForm fieldset {border: 0;} @@ -6597,7 +6875,7 @@ fieldset#environment legend i[class*="icon-"] { .icon-plus.cboxElement:hover {box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);} #albumSelection {margin-right: 20px;} .selectize-control.single .selectize-input {border-radius: 0; font-weight: bold;font-size: 12px;} -.buttonLike {padding: 8px 10px; margin-left: 5px;} +.buttonLike, .buttonSecondary {padding: 8px 10px; margin-left: 5px;} .changeUsername .buttonLike {padding: 1px 10px;} .changePassword .buttonLike {padding: 1px 10px;} .selectFilesButtonBlock {display: flex; margin-top: 10px;} diff --git a/admin/themes/roma/theme.css b/admin/themes/roma/theme.css index ea0521ae5..6ddea9e9a 100644 --- a/admin/themes/roma/theme.css +++ b/admin/themes/roma/theme.css @@ -2394,6 +2394,64 @@ ul.jqtree-tree li.jqtree-ghost span.jqtree-line { background-color:#444; } +.comment-box, .comment-box:focus{ + background-color: #333; + color: #777; + border-color: #777; +} + +.comment-box .comment{ + color : #777; +} + +.comment-selection-content{ + background-color: rgb(51, 51, 51); + border-left: 1px solid #3A3A3A; +} + +.badge-grey{ + background-color: rgb(63, 63, 63); + color: rgb(186, 186, 186); +} + +.selectButton{ + background-color: rgb(85, 85, 85); + color: rgb(193, 193, 193); +} + +.selectButton2{ + border-color: rgb(85, 85, 85); + color: #C1C1C1; +} + +.delete-comment{ + background-color: rgb(85, 85, 85); + color: rgb(193, 193, 193); +} + +.comment-select-checkbox, .comment-select-checkbox:focus{ + background-color: #333; +} + +.commentFilterSelected, .commentFilterSelected:hover { + color: #FFFFFF; + background-color: #FFA500; + border-bottom: solid #D18800; +} +.commentFilterUnselected, .commentFilterUnselected:hover { + color: #F3F3F3; + background-color: #898989; + border-bottom: solid #DBDBDB; +} + +.buttonSecondary { + background-color: #2E2E2E; + color: #777777; +} +.buttonSecondary:hover { + background-color: #1B1B1B; + color: #777777; + /* Filters options */ .select-views{ background-color: #444444;