Author Topic: [MOD] Search jQuery Tag Suggestion / Keywords  (Read 25448 times)

0 Members and 1 Guest are viewing this topic.

Offline Lucifix

  • Hero Member
  • *****
  • Posts: 710
    • View Profile
    • http://www.slo-foto.net
[MOD] Search jQuery Tag Suggestion / Keywords
« on: October 20, 2009, 07:42:05 AM »
On web I've found interesting jquery plugin that suggest you some keywords. To understand it plz check first demo:
http://remysharp.com/wp-content/uploads/2007/12/tagging.php

I was thinking to integrated it with 4images gallery but the everytime I connect it with 4images database my server crashed.

Does anyone have idea how to implent it with database (4images_wordlist table)?

Link: http://remysharp.com/2007/12/28/jquery-tag-suggestion/

UPDATE: after searching on 4images forum I've found great idea. Comming soon ;)
« Last Edit: October 28, 2009, 04:41:01 PM by mawenzi »

Offline Lucifix

  • Hero Member
  • *****
  • Posts: 710
    • View Profile
    • http://www.slo-foto.net
Re: jQuery Tag Suggestion / Keywords
« Reply #1 on: October 26, 2009, 01:00:12 PM »
Okey, here we go, but I must warn you that this is BETA MOD and it should be tested by someone who knows what he's doing :)

1. Open member_uploadform.html in your templates folder:

change:
Code: [Select]
<textarea cols="30" class="textarea" rows="10" wrap="VIRTUAL" name="image_keywords">{image_keywords}</textarea>
to:
Code: [Select]
<textarea cols="30" class="textarea" rows="10" wrap="VIRTUAL" name="image_keywords" id="image_keywords">{image_keywords}</textarea>
if its not working try this:
Code: [Select]
<input type="text" name="image_keywords" id="image_keywords" />
2. Open header.html

after:
Code: [Select]
<link rel="stylesheet" href="{template_url}/style.css" />
add:
Code: [Select]
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="tag.js"></script>
<script type="text/javascript">
<!--
$(function () {

$('#image_keywords').tagSuggest({
url: '{url_tags}',
delay: 250
});
});
//-->
</script>
    <style type="text/css" media="screen">
    <!--
      SPAN.tagMatches {
          margin-left: 10px;
      }
      
      SPAN.tagMatches SPAN {
          padding: 2px;
          margin-right: 4px;
          background-color: #0000AB;
          color: #fff;
          cursor: pointer;
      }
      
      PRE {
          background: #ddd;
          font-family: Courier;
          padding: 5px;
          overflow: auto;
      }
    -->
    </style>

3. Open includes/page_header.php and

after
Code: [Select]
"url_captcha_image" => $site_sess->url(ROOT_PATH."captcha.php"),
add
Code: [Select]
"url_tags" => $site_sess->url(ROOT_PATH."tags.php"),
4. Create new file tags.php and upload it to root folder of your 4images gallery:
Code: [Select]
<?php
$main_template 
0;
$nozip 1;
define('ROOT_PATH''./');
include(
ROOT_PATH.'global.php');
require(
ROOT_PATH.'includes/sessions.php');
include(
ROOT_PATH.'includes/search_utils.php');

$tag = isset($HTTP_GET_VARS['tag']) ? un_htmlspecialchars(trim($HTTP_GET_VARS['tag'])) : "";
$tag strip_tags(trim($tag));
$tag convert_special($tag);
$tag str_replace("%"""$tag);
if (
$tag !== "") {
  
$sql "SELECT DISTINCT i.word_text
          FROM 4images_wordlist i
          LEFT JOIN 4images_wordmatch c ON i.word_id = c.word_id
          WHERE c.keys_match >= 0 AND i.word_text LIKE '"
.$tag."%'
          ORDER BY RAND()
          LIMIT 5"
;
  
$result $site_db->query($sql);
  echo 
'[';
  while (
$row $site_db->fetch_array($result))
  {
    if (isset(
$word_text))
      echo 
",";
    
$word_text $n str_replace('"''&quot;'$row['word_text']);
    echo 
'"'.$word_text.'"';
  }
  echo 
']';
}
?>

5. Download file:
http://remysharp.com/downloads/tag.js

And upload it to your root directory.

I hope that's all, test it and let me know if it's working...

[EDIT by V@no]
fixed error in tags.php plus added little filter and fixed wrong filename tags.js instead of tag.js in header.html
« Last Edit: November 21, 2009, 05:18:58 AM by V@no »

Offline V@no

  • If you don't tell me what to do, I won't tell you where you should go :)
  • Global Moderator
  • 4images Guru
  • *****
  • Posts: 17.849
  • mmm PHP...
    • View Profile
    • 4images MODs Demo
Re: jQuery Tag Suggestion / Keywords
« Reply #2 on: October 26, 2009, 01:20:13 PM »
in 4images do not use $_GET/$_POST, unless absolutely necessary and unless your code does filtering these inputs by itself. Otherwise use $HTTP_GET_VARS instead.

And I'm curious, how will that code handle words that using non-latin charset?
Your first three "must do" before you ask a question:
Please do not PM me asking for help unless you've been specifically asked to do so. Such PMs will be deleted without answer. (forum rule #6)
Extension for Firefox/Thunderbird: Master Password+    Back/Forward History Tweaks (restartless)    Cookies Manager+    Fit Images (restartless for Thunderbird)

Offline Lucifix

  • Hero Member
  • *****
  • Posts: 710
    • View Profile
    • http://www.slo-foto.net
Re: jQuery Tag Suggestion / Keywords
« Reply #3 on: October 26, 2009, 01:38:44 PM »
in 4images do not use $_GET/$_POST, unless absolutely necessary and unless your code does filtering these inputs by itself. Otherwise use $HTTP_GET_VARS instead.

And I'm curious, how will that code handle words that using non-latin charset?

I alway forgot to use $HTTP_GET_VARS insted of $_GET :) I'll fix that...

Otherwise I have no clue how will this work on non-latin charset - I haven't include this yet in my gallery, but if someone has installed test version of 4images gallery can check this out.

Offline Kaliha

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #4 on: November 20, 2009, 12:46:03 PM »
кто может обьяснить что именно делает этот мод?
Sorry for my english, i use google translate )

Offline V@no

  • If you don't tell me what to do, I won't tell you where you should go :)
  • Global Moderator
  • 4images Guru
  • *****
  • Posts: 17.849
  • mmm PHP...
    • View Profile
    • 4images MODs Demo
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #5 on: November 20, 2009, 03:14:04 PM »
этот мод выводит список подсказок возможных ключевых слов во время ввода в поле поиска, примерно как это делается на google
Your first three "must do" before you ask a question:
Please do not PM me asking for help unless you've been specifically asked to do so. Such PMs will be deleted without answer. (forum rule #6)
Extension for Firefox/Thunderbird: Master Password+    Back/Forward History Tweaks (restartless)    Cookies Manager+    Fit Images (restartless for Thunderbird)

Offline Kaliha

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #6 on: November 20, 2009, 04:43:38 PM »
а на основании чего он выводит подсказки? и как проявляется работа?
Up, выдает ошибку в IE матюкается на код $('#image_keywords').tagSuggest({ и ниче не работает ((
« Last Edit: November 20, 2009, 04:55:19 PM by Kaliha »
Sorry for my english, i use google translate )

rinaldos

  • Guest
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #7 on: November 21, 2009, 12:20:25 AM »
@Lucifix

Please change in LINE10 this
Code: [Select]
$tag = $HTTP_GET_VARS['tag']);

to
Code: [Select]
$tag = $HTTP_GET_VARS['tag'];

There is a ")" wrong :-)

Gruß

Offline V@no

  • If you don't tell me what to do, I won't tell you where you should go :)
  • Global Moderator
  • 4images Guru
  • *****
  • Posts: 17.849
  • mmm PHP...
    • View Profile
    • 4images MODs Demo
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #8 on: November 21, 2009, 03:06:53 AM »
а на основании чего он выводит подсказки? и как проявляется работа?
Up, выдает ошибку в IE матюкается на код $('#image_keywords').tagSuggest({ и ниче не работает ((
Подсказки берутся из ключевых слов записанных в базе данных в таблице "4images_keywords"
на счёт ошибки, нужно изменить tags.js на tag.js в header.html
также нужно исправить ошибку, про которую написал rinaldos (всё уже исправлено в инструкции)


@All:
Keep in mind, this mod will display "real" keywords only. By "real" I mean the keywords that were manually submitted with images, NOT that are automatically generated from image names and descriptions.
If you want to change that, then in tags.php replace:
Code: (MySQL query) [Select]
          WHERE c.keys_match > 0 AND i.word_text LIKE '".$tag."%'
with:
Code: (MySQL query) [Select]
          WHERE i.word_text LIKE '".$tag."%'

Also, it will return only 5 keywords sorted randomly.
« Last Edit: November 21, 2009, 05:20:02 AM by V@no »
Your first three "must do" before you ask a question:
Please do not PM me asking for help unless you've been specifically asked to do so. Such PMs will be deleted without answer. (forum rule #6)
Extension for Firefox/Thunderbird: Master Password+    Back/Forward History Tweaks (restartless)    Cookies Manager+    Fit Images (restartless for Thunderbird)

Offline Kaliha

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #9 on: November 21, 2009, 05:11:19 PM »
поправил, но результата в Опере неувидел, может в IE только работает?
Sorry for my english, i use google translate )

Offline V@no

  • If you don't tell me what to do, I won't tell you where you should go :)
  • Global Moderator
  • 4images Guru
  • *****
  • Posts: 17.849
  • mmm PHP...
    • View Profile
    • 4images MODs Demo
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #10 on: November 21, 2009, 08:28:34 PM »
у меня работает во-всех браузерах.
Your first three "must do" before you ask a question:
Please do not PM me asking for help unless you've been specifically asked to do so. Such PMs will be deleted without answer. (forum rule #6)
Extension for Firefox/Thunderbird: Master Password+    Back/Forward History Tweaks (restartless)    Cookies Manager+    Fit Images (restartless for Thunderbird)

Offline Kaliha

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #11 on: November 21, 2009, 11:37:43 PM »
а можно посмотреть в действии? на каком сайте установленно?
Sorry for my english, i use google translate )

Offline V@no

  • If you don't tell me what to do, I won't tell you where you should go :)
  • Global Moderator
  • 4images Guru
  • *****
  • Posts: 17.849
  • mmm PHP...
    • View Profile
    • 4images MODs Demo
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #12 on: November 21, 2009, 11:51:36 PM »
тестирую на локальном...
так я не понял, в IE работает? Если, да, то что опера говорит, есть ли какие ошибки?
Your first three "must do" before you ask a question:
Please do not PM me asking for help unless you've been specifically asked to do so. Such PMs will be deleted without answer. (forum rule #6)
Extension for Firefox/Thunderbird: Master Password+    Back/Forward History Tweaks (restartless)    Cookies Manager+    Fit Images (restartless for Thunderbird)

Offline Kaliha

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: [MOD] Search jQuery Tag Suggestion / Keywords
« Reply #13 on: November 22, 2009, 03:13:13 PM »
ни в IE нив Opera у меня неполучилось установить. сегодня поробую на чистый движек поставить
позже
В Опере заработало, но только с латиницой(
« Last Edit: November 22, 2009, 03:31:03 PM by Kaliha »
Sorry for my english, i use google translate )