related to #1465 added ip and download filter + some titles to lines + listenners

admin/themes/default/js/history.js

@@ -60,6 +60,46 @@ $(document).ready(() => {
 
   activateLineOptions();
 
+  $(".elem-type-select").on("change", function (e) {
+    console.log($(".elem-type-select option:selected").attr("value"));
+
+    if ($(".elem-type-select option:selected").attr("value") == "visited") {
+      current_data.types = {
+        0: "none",
+        1: "picture"
+      }
+    } else if ($(".elem-type-select option:selected").attr("value") == "downloaded"){
+      current_data.types = {
+        0: "high",
+        1: "other"
+      }
+    } else {
+      current_data.types = {
+        0: "none",
+        1: "picture",
+        2: "high",
+        3: "other"
+      }
+    }
+
+    fillHistoryResult(current_data)
+  })
+
+  //TODO
+  $('.date-start [data-datepicker]').on("toggle", function () {
+    console.log("CLOSED");
+  })
+
+  $('.date-start .hasDatepicker').on("click", function () {
+    console.log($('.date-start input[name="start"]').attr("value"));
+    current_data.start = $('.date-start input[name="start"]').attr("value");
+  });
+
+  $('.date-end .hasDatepicker').on("click", function () {
+    console.log($('.date-end input[name="end"]').attr("value"));
+    current_data.end = $('.date-start input[name="start"]').attr("value");
+  });
+
 })
 
 function activateLineOptions() {
@@ -153,7 +193,7 @@ function lineConstructor(line, id, imageDisplay) {
   newLine.removeClass("hide");
 
   /* console log to help debug */
-  // console.log(line);
+  console.log(line);
   newLine.attr("id", id);
   // console.log(id);
 
@@ -161,23 +201,73 @@ function lineConstructor(line, id, imageDisplay) {
   newLine.find(".date-hour").html(line.TIME);
 
   newLine.find(".user-name").html(line.USERNAME);
+
   newLine.find(".user-name").attr("id", line.USERID);
+  if (current_data.user == "-1") {
     newLine.find(".user-name").on("click", function ()  {
       current_data.user = $(this).attr('id') + "";
       addUserFilter($(this).html());
       fillHistoryResult(current_data);
     })
+  }
+
   newLine.find(".user-ip").html(line.IP);
+  if (current_data.ip == "") {
+    newLine.find(".user-ip").on("click", function () {
+      current_data.ip = $(this).html();
+      addIpFilter($(this).html());
+      fillHistoryResult(current_data);
+    })
+  }
+
+  newLine.find(".add-img-as-filter").data("img-id", line.IMAGEID);
+  if (current_data.image_id == "") {
+    newLine.find(".add-img-as-filter").on("click", function () {
+      current_data.image_id = $(this).data("img-id");
+      addImageFilter($(this).data("img-id"));
+      fillHistoryResult(current_data);
+    });
+  }
   newLine.find(".edit-img").attr("href", line.EDIT_IMAGE)
 
+  switch (line.SECTION) {
+    case "tags":
+      newLine.find(".type-name").html(line.TAGS[0]);
+      newLine.find(".type-id").html("#" + line.TAGIDS[0]);
+      let detail_str = "";
+      line.TAGS.forEach(tag => {
+        detail_str += tag + ", ";
+      });
+      detail_str = detail_str.slice(0, -2)
+      newLine.find(".detail-item-2").html(detail_str);
+      newLine.find(".detail-item-2").attr("title", detail_str);
+      break;
+    
+    case "most_visited":
+      newLine.find(".type-name").html(str_most_visited);
+      newLine.find(".type-id").remove();
+      break;
+    case "best_rated":
+      newLine.find(".type-name").html(str_best_rated);
+      newLine.find(".type-id").remove();
+      break;
+    case "list":
+      newLine.find(".type-name").html(str_list);
+      newLine.find(".type-id").remove();
+      break;
+    case "favorites":
+      newLine.find(".type-name").html(str_favorites);
+      newLine.find(".type-id").remove();
+      break;
+
+    default:
+      break;
+  }
+
   if (line.IMAGE != "") {
     newLine.find(".type-name").html(line.IMAGENAME);
-    if (imageDisplay !== "no_display_thumbnail") {
     newLine.find(".type-icon").html(line.IMAGE);
-    } else {
-      newLine.find(".type-icon").addClass("line-icon icon-picture icon-yellow");
-      newLine.find(".type-icon .icon-file-image").removeClass("icon-file-image");
-    }
+    newLine.find(".type-id").html("#" + line.IMAGEID)
   } else {
     newLine.find(".type-icon .icon-file-image").removeClass("icon-file-image");
     newLine.find(".toggle-img-option").hide();
@@ -191,7 +281,12 @@ function lineConstructor(line, id, imageDisplay) {
   }
 
   newLine.find(".detail-item-1").html(line.SECTION);
-  
+  if (line.TYPE == "high") {
+    newLine.find(".detail-item-1").html(str_dwld).addClass("icon-blue").removeClass("detail-item-1");
+    newLine.find(".date-dwld-icon").addClass("icon-blue icon-floppy")
+  } else {
+    newLine.find(".date-dwld-icon").remove();
+  }
   displayLine(newLine);
 }
 
@@ -200,10 +295,7 @@ function displayLine(line) {
 }
 
 function addUserFilter(username) {
-  console.log(username);
   var newFilter = $("#default-filter").clone();
-  console.log(newFilter);
-
   newFilter.removeClass("hide");
 
   newFilter.find(".filter-title").html(username);
@@ -219,3 +311,39 @@ function addUserFilter(username) {
 
   $(".filter-container").append(newFilter);
 }
+
+function addIpFilter(ip) {
+  var newFilter = $("#default-filter").clone();
+  newFilter.removeClass("hide");
+
+  newFilter.find(".filter-title").html(ip);
+  newFilter.find(".filter-icon").addClass("icon-code");
+
+  newFilter.find(".remove-filter").on("click", function () {
+    $(this).parent().remove();
+
+    current_data.ip = "";
+    fillHistoryResult(current_data);
+
+  })
+
+  $(".filter-container").append(newFilter);
+}
+
+function addImageFilter(img_id) {
+  var newFilter = $("#default-filter").clone();
+  newFilter.removeClass("hide");
+
+  newFilter.find(".filter-title").html("Image #" + img_id);
+  newFilter.find(".filter-icon").addClass("icon-picture");
+
+  newFilter.find(".remove-filter").on("click", function () {
+    $(this).parent().remove();
+
+    current_data.image_id = "";
+    fillHistoryResult(current_data);
+
+  })
+
+  $(".filter-container").append(newFilter);
+}

admin/themes/default/template/history.tpl

@@ -28,10 +28,15 @@ var current_data = {
   image_id: "",
   filename: "",
   ip: "",
-  display_thumbnail: "no_display_thumbnail",
+  display_thumbnail: "display_thumbnail_classic",
 }
 
 const API_METHOD = "{$API_METHOD}";
+const str_dwld = "{'Downloaded'|translate}";
+const str_most_visited = "{'Most visited'|translate}";
+const str_best_rated = "{'Best rated'|translate}";
+const str_list = "{'Random'|translate}";
+const str_favorites = "{'Favorites'|translate}";
 {/footer_script}
 
 {combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
@@ -136,7 +141,10 @@ const API_METHOD = "{$API_METHOD}";
       <label>
         {'Element type'|@translate}
         <select name="types[]" class="elem-type-select user-action-select advanced-filter-select">
-          {html_options values=$type_option_values output=$type_option_values|translate selected=$type_option_selected}
+          {* {html_options values=$type_option_values output=$type_option_values|translate selected=$type_option_selected} *}
+          <option value=""></option>
+          <option value="visited">{'Visited'|@translate} </option>
+          <option value="downloaded">{'Downloaded'|@translate} </option>
         </select>
       </label>
     </div>
@@ -191,20 +199,23 @@ const API_METHOD = "{$API_METHOD}";
   {* Used to be copied in js *}
   <div class="search-line hide" id="-1">
       <div class="date-section">
+        <i class="date-dwld-icon"> </i>
+        <div class="date-infos">
           <span class="date-day bold"> July 4th, 2042 </span>
           <span> at <span class="date-hour">23:59:59</span> </span>
         </div>
+      </div>
 
       <div class="user-section">
-        <span class="user-name bold"> Zac le boss </span>
-        <span class="user-ip"> 192.168.0.0</span>
+        <span class="user-name bold" title="{'Add a filter'}"> Zac le boss </span>
+        <span class="user-ip" title="{'Add a filter'}"> 192.168.0.0</span>
       </div>
 
       <div class="type-section">
         <span class="type-icon"> <i class="icon-file-image"> </i> </span>
         <span class="icon-ellipsis-vert toggle-img-option">
           <div class="img-option">
-            <span> Add as filter </span>
+            <span class="add-img-as-filter"> Add as filter </span>
             <a class="edit-img" href="">{'Edit'|@translate}</a>
           </div>
         </span>
@@ -390,6 +401,10 @@ jQuery(document).ready( function() {
   border-top-left-radius: 5px;
 }
 
+.user-name, .user-ip {
+  cursor: pointer;
+}
+
 .search-line {
   background: #fafafa;
   box-shadow: 0px 2px 4px #00000024;
@@ -423,7 +438,7 @@ jQuery(document).ready( function() {
 
 .date-title,
 .date-section {
-  width: 200px;
+  width: 300px;
   text-align: left;
   padding-left: 10px;
 }
@@ -450,7 +465,6 @@ jQuery(document).ready( function() {
 }
 
 .detail-item {
-  background: #f0f0f0f0;
   margin: 0 10px 0 0;
   padding: 4px 8px;
   border-radius: 5px;
@@ -467,7 +481,10 @@ jQuery(document).ready( function() {
   white-space: nowrap;
 }
 
-.date-section,
+.detail-item-1, .detail-item-2, .detail-item-3 {
+  background: #f0f0f0f0;
+}
+
 .user-section {
   display: flex;
   flex-direction: column;
@@ -477,6 +494,35 @@ jQuery(document).ready( function() {
   border-right: 1px solid #bbb;
 }
 
+.date-section {
+  display: flex;
+  flex-direction: row;
+  margin-right: 20px;
+  height: 60%;
+  border-right: 1px solid #bbb;
+}
+
+.date-infos {
+  display: flex;
+  flex-direction: column;
+  text-align: left;
+}
+
+.date-dwld-icon {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 10px;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  margin-right: 10px;
+}
+
+.date-dwld-icon::before {
+  transform: scale(1.2);
+}
+
 .detail-section {
   display: flex;
   flex-direction: row;
@@ -502,7 +548,7 @@ jQuery(document).ready( function() {
 .toggle-img-option {
   cursor: pointer;
   position: absolute;
-  margin-left: 38px;
+  margin-left: 71px;
 }
 
 .toggle-img-option::before{
@@ -550,4 +596,9 @@ jQuery(document).ready( function() {
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
 }
+
+.type-icon img {
+  width: 70px;
+  height: 70px;
+}
 </style>

include/ws_functions/pwg.php

@@ -827,7 +827,7 @@ SELECT
     $result = pwg_query($query);
     while ($row=pwg_db_fetch_assoc($result))
     {
-      $name_of_tag[ $row['id'] ] = '<a href="'.make_index_url( array('tags'=>array($row))).'">'.trigger_change("render_tag_name", $row['name'], $row).'</a>';
+      $name_of_tag[ $row['id'] ] = trigger_change("render_tag_name", $row["name"], $row);
     }
   }
 
@@ -880,23 +880,23 @@ SELECT
     $user_string.= '&amp;user_id='.$line['user_id'];
     $user_string.= '">+</a>';
 
-    $tags_string = '';
+    $tag_names = '';
+    $tag_ids = '';
     if (isset($line['tag_ids']))
     {
-      $tags_string = preg_replace_callback(
+      $tag_names = preg_replace_callback(
         '/(\d+)/',
         function($m) use ($name_of_tag) { return isset($name_of_tag[$m[1]]) ? $name_of_tag[$m[1]] : $m[1];} ,
-        str_replace(
-          ',',
-          ', ',
           $line['tag_ids']
-          )
         );
+      $tag_ids = $line['tag_ids'];
     }
 
     $image_string = '';
     $image_title = '';
     $image_edit_string = '';
+    $image_id = '';
+    $cat_name = '';
     if (isset($line['image_id']))
     {
       $image_edit_string = PHPWG_ROOT_PATH.'admin.php?page=photo-'.$line['image_id'];
@@ -933,33 +933,17 @@ SELECT
       }
 
       $image_string = '';
+      $image_id = $line['image_id'];
 
-      switch ($thumbnail_display)
-      {
-        case 'no_display_thumbnail':
-        {
-          $image_string= '<a href="'.$picture_url.'">'.$image_title.'</a>';
-          break;
-        }
-        case 'display_thumbnail_classic':
-        {
       $image_string =
-            '<a class="thumbnail" href="'.$picture_url.'">'
-            .'<span><img src="'.DerivativeImage::thumb_url($element)
-            .'" alt="'.$image_title.'" title="'.$image_title.'">'
-            .'</span></a>';
-          break;
-        }
-        case 'display_thumbnail_hoverbox':
-        {
-          $image_string =
-            '<a class="over icon-file-image" href="'.$picture_url.'">'
-            .'<span><img src="'.DerivativeImage::thumb_url($element)
-            .'" alt="'.$image_title.'" title="'.$image_title.'">'
-            .'</span></a>';
-          break;
-        }
-      }
+      '<span><img src="'.DerivativeImage::url(ImageStdParams::get_by_type(IMG_SQUARE), $element)
+      .'" alt="'.$image_title.'" title="'.$image_title.'">';
+
+      $cat_name = isset($line['category_id'])
+      ? ( isset($name_of_category[$line['category_id']])
+            ? $name_of_category[$line['category_id']]
+            : 'deleted '.$line['category_id'] )
+      : '';
     }
     /** */
     
@@ -973,15 +957,13 @@ SELECT
         'IP'        => $line['IP'],
         'IMAGE'     => $image_string,
         'IMAGENAME' => $image_title,
+        'IMAGEID'   => $image_id,
         'EDIT_IMAGE'=> $image_edit_string,
         'TYPE'      => $line['image_type'],
         'SECTION'   => $line['section'],
-        'CATEGORY'  => isset($line['category_id'])
-          ? ( isset($name_of_category[$line['category_id']])
-                ? $name_of_category[$line['category_id']]
-                : 'deleted '.$line['category_id'] )
-          : '',
-        'TAGS'       => $tags_string,
+        'CATEGORY'  => $cat_name,
+        'TAGS'       => explode(",",$tag_names),
+        'TAGIDS'     => explode(",",$tag_ids),
       )
     );
 

language/en_UK/admin.lang.php

@@ -1259,3 +1259,10 @@ $lang['Purge Cache'] = 'Purge Cache';
 $lang['Rename "%s"'] = 'Rename "%s"';
 $lang['Yes, rename'] = 'Yes, rename';
 $lang['Tag name'] = 'Tag name';
+
+$lang['Visited'] = 'Visited';
+$lang['Downloaded'] = 'Downloaded';
+$lang['Most visited'] = 'Most visited';
+$lang['Best rated'] = 'Best rated';
+$lang['Random'] = 'Random';
+$lang['Favorites'] = 'Favorites';

language/fr_FR/admin.lang.php

@@ -1261,3 +1261,10 @@ $lang['Purge Cache'] = 'Purger le cache';
 $lang['Rename "%s"'] = 'Renommer "%s"';
 $lang['Yes, rename'] = 'Oui, renommer';
 $lang['Tag name'] = 'Nom du tag';
+
+$lang['Visited'] = 'Visité';
+$lang['Downloaded'] = 'Téléchargé';
+$lang['Most visited'] = 'Les plus visitées';
+$lang['Best rated'] = 'Les mieux notées';
+$lang['Random'] = 'Aléatoire';
+$lang['Favorites'] = 'Favoris';