aboutsummaryrefslogtreecommitdiffstats
path: root/admin
diff options
context:
space:
mode:
authorplegall <plg@piwigo.org>2010-03-06 22:10:23 +0000
committerplegall <plg@piwigo.org>2010-03-06 22:10:23 +0000
commit1c545c601beeeaafacd367d7af2077742c0fcce6 (patch)
tree95ac1513741ea80c6bed3afd6869a1fdd3ec0bed /admin
parent97a8ddcfe7c8d3f50b3e577c0915c551e7af12fa (diff)
feature 724: improved "add tags" form. Instead of a big list of checkboxes,
displays a dynamic list of tags with jQuery, with suggestions based on existing tags and the ability to create new tags on the fly. The change was applied only on admin/picture_modify.php for test purpose. Note : FCBKcomplete 2.7 had a bug on "remote tag" click, and the bug was fixed on 2.7.1. But the suggestions were not working with 2.7.1. So I took the 2.7 and applied the tiny change to make the "remove tag" click work. git-svn-id: http://piwigo.org/svn/trunk@5067 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to '')
-rw-r--r--admin.php25
-rw-r--r--admin/picture_modify.php78
-rw-r--r--admin/template/goto/default-layout.css44
-rw-r--r--admin/template/goto/icon/fcbkcomplete_close.gifbin0 -> 90 bytes
-rw-r--r--admin/template/goto/picture_modify.tpl27
5 files changed, 143 insertions, 31 deletions
diff --git a/admin.php b/admin.php
index bc69f7321..d2ed70747 100644
--- a/admin.php
+++ b/admin.php
@@ -34,6 +34,31 @@ include_once(PHPWG_ROOT_PATH.'admin/include/functions_plugins.inc.php');
// +-----------------------------------------------------------------------+
check_status(ACCESS_ADMINISTRATOR);
+// tags
+if (isset($_GET['fckb_tags']))
+{
+ $query = '
+SELECT
+ id,
+ name
+ FROM '.TAGS_TABLE.'
+;';
+ $result = pwg_query($query);
+ $taglist = array();
+ while ($row = pwg_db_fetch_assoc($result))
+ {
+ array_push(
+ $taglist,
+ array(
+ 'caption' => $row['name'],
+ 'value' => '~~'.$row['id'].'~~',
+ )
+ );
+ }
+ echo json_encode($taglist);
+ exit();
+}
+
// +-----------------------------------------------------------------------+
// | synchronize user informations |
// +-----------------------------------------------------------------------+
diff --git a/admin/picture_modify.php b/admin/picture_modify.php
index c7914f3a0..42306fc23 100644
--- a/admin/picture_modify.php
+++ b/admin/picture_modify.php
@@ -106,8 +106,32 @@ if (isset($_POST['submit']) and count($page['errors']) == 0 and !is_adviser())
array($data)
);
+ // In $_POST[tags] we receive something like array('~~6~~', '~~59~~', 'New
+ // tag', 'Another new tag') The ~~34~~ means that it is an existing
+ // tag. I've added the surrounding ~~ to permit creation of tags like "10"
+ // or "1234" (numeric characters only)
+ $tag_ids = array();
+ if (isset($_POST['tags']))
+ {
+ foreach ($_POST['tags'] as $raw_tag)
+ {
+ if (preg_match('/^~~(\d+)~~$/', $raw_tag, $matches))
+ {
+ array_push($tag_ids, $matches[1]);
+ }
+ else
+ {
+ // we have to create a new tag
+ array_push(
+ $tag_ids,
+ tag_id_from_tag_name($raw_tag)
+ );
+ }
+ }
+ }
+
set_tags(
- isset($_POST['tags']) ? $_POST['tags'] : array(),
+ $tag_ids,
$_GET['image_id']
);
@@ -169,6 +193,29 @@ if (isset($_POST['dismiss'])
set_random_representant($_POST['cat_elected']);
}
+// tags
+$tags = array();
+
+$query = '
+SELECT
+ tag_id,
+ name
+ FROM '.IMAGE_TAG_TABLE.' AS it
+ JOIN '.TAGS_TABLE.' AS t ON t.id = it.tag_id
+ WHERE image_id = '.$_GET['image_id'].'
+;';
+$result = pwg_query($query);
+while ($row = pwg_db_fetch_assoc($result))
+{
+ array_push(
+ $tags,
+ array(
+ 'value' => '~~'.$row['tag_id'].'~~',
+ 'caption' => $row['name'],
+ )
+ );
+}
+
// retrieving direct information about picture
$query = '
SELECT *
@@ -185,14 +232,6 @@ if (!empty($row['storage_category_id']))
$image_file = $row['file'];
-// tags
-$query = '
-SELECT tag_id
- FROM '.IMAGE_TAG_TABLE.'
- WHERE image_id = '.$_GET['image_id'].'
-;';
-$selected_tags = array_from_query($query, 'tag_id');
-
// +-----------------------------------------------------------------------+
// | template init |
// +-----------------------------------------------------------------------+
@@ -203,26 +242,9 @@ $template->set_filenames(
)
);
-$all_tags = get_all_tags();
-
-if (count($all_tags) > 0)
-{
- $tag_selection = get_html_tag_selection(
- $all_tags,
- 'tags',
- $selected_tags
- );
-}
-else
-{
- $tag_selection =
- '<p>'.
- l10n('No tag defined. Use Administration>Pictures>Tags').
- '</p>';
-}
-
$template->assign(
array(
+ 'tags' => $tags,
'U_SYNC' =>
get_root_url().'admin.php?page=picture_modify'.
'&amp;image_id='.$_GET['image_id'].
@@ -245,8 +267,6 @@ $template->assign(
'AUTHOR' => isset($_POST['author']) ? $_POST['author'] : @$row['author'],
- 'TAG_SELECTION' => $tag_selection,
-
'DESCRIPTION' =>
htmlspecialchars( isset($_POST['description']) ?
stripslashes($_POST['description']) : @$row['comment'] ),
diff --git a/admin/template/goto/default-layout.css b/admin/template/goto/default-layout.css
index 14116e1c2..9f4437d06 100644
--- a/admin/template/goto/default-layout.css
+++ b/admin/template/goto/default-layout.css
@@ -455,3 +455,47 @@ UL.tagSelection LI {
img.ui-datepicker-trigger {
cursor : pointer;
}
+
+/* jQuery FCBKcomplete */
+/* TextboxList sample CSS */
+ul.holder { margin: 0; border: 1px solid #999; overflow: hidden; height: auto !important; height: 1%; padding: 4px 5px 0; }
+*:first-child+html ul.holder { padding-bottom: 2px; } * html ul.holder { padding-bottom: 2px; } /* ie7 and below */
+ul.holder li { float: left; list-style-type: none; margin: 0 5px 4px 0; white-space:nowrap;}
+ul.holder li.bit-box, ul.holder li.bit-input input { font: 11px "Lucida Grande", "Verdana"; }
+ul.holder li.bit-box { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; border: 1px solid #CAD8F3; background: #DEE7F8; padding: 1px 5px 2px; }
+ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
+ul.holder li.bit-input input { width: auto; overflow:visible; margin: 0; border: 0px; outline: 0; padding: 3px 0px 2px; } /* no left/right padding here please */
+ul.holder li.bit-input input.smallinput { width: 20px; }
+
+/* Facebook demo CSS */
+#add { border: 1px solid #999; width: 550px; margin: 50px; padding: 20px 30px 10px; }
+form ol li { list-style-type: none; }
+form ol { font: 11px "Lucida Grande", "Verdana"; margin: 0; padding: 0; }
+form ol li.input-text { margin-bottom: 10px; list-style-type: none; padding-bottom: 10px; }
+form ol li.input-text label { font-weight: bold; cursor: pointer; display: block; font-size: 13px; margin-bottom: 10px; }
+form ol li.input-text input { width: 500px; padding: 5px 5px 6px; font: 11px "Lucida Grande", "Verdana"; border: 1px solid #999; }
+form ul.holder { width: 500px; }
+form ul { margin: 0 !important }
+ul.holder li.bit-box, #apple-list ul.holder li.bit-box { padding-right: 15px; position: relative; z-index:1000;}
+#apple-list ul.holder li.bit-input { margin: 0; }
+#apple-list ul.holder li.bit-input input.smallinput { width: 5px; }
+ul.holder li.bit-hover { background: #BBCEF1; border: 1px solid #6D95E0; }
+ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
+ul.holder li.bit-box a.closebutton { position: absolute; right: 4px; top: 5px; display: block; width: 7px; height: 7px; font-size: 1px; background: url(icon/fcbkcomplete_close.gif); }
+ul.holder li.bit-box a.closebutton:hover { background-position: 7px; }
+ul.holder li.bit-box-focus a.closebutton, ul.holder li.bit-box-focus a.closebutton:hover { background-position: bottom; }
+
+/* Autocompleter */
+
+.facebook-auto { display: none; position: absolute; width: 512px; background: #eee; }
+.facebook-auto .default { padding: 5px 7px; border: 1px solid #ccc; border-width: 0 1px 1px;font-family:"Lucida Grande","Verdana"; font-size:11px; }
+.facebook-auto ul { display: none; margin: 0; padding: 0; overflow: auto; position:absolute; z-index:9999}
+.facebook-auto ul li { padding: 5px 12px; z-index: 1000; cursor: pointer; margin: 0; list-style-type: none; border: 1px solid #ccc; border-width: 0 1px 1px; font: 11px "Lucida Grande", "Verdana"; background-color: #eee }
+.facebook-auto ul li em { font-weight: bold; font-style: normal; background: #ccc; }
+.facebook-auto ul li.auto-focus { background: #4173CC; color: #fff; }
+.facebook-auto ul li.auto-focus em { background: none; }
+.deleted { background-color:#4173CC !important; color:#ffffff !important;}
+.hidden { display:none;}
+
+#demo ul.holder li.bit-input input { padding: 2px 0 1px; border: 1px solid #999; }
+.ie6fix {height:1px;width:1px; position:absolute;top:0px;left:0px;z-index:1;} \ No newline at end of file
diff --git a/admin/template/goto/icon/fcbkcomplete_close.gif b/admin/template/goto/icon/fcbkcomplete_close.gif
new file mode 100644
index 000000000..cc2199248
--- /dev/null
+++ b/admin/template/goto/icon/fcbkcomplete_close.gif
Binary files differ
diff --git a/admin/template/goto/picture_modify.tpl b/admin/template/goto/picture_modify.tpl
index 4c8315d9b..77f1671a6 100644
--- a/admin/template/goto/picture_modify.tpl
+++ b/admin/template/goto/picture_modify.tpl
@@ -1,8 +1,25 @@
-
{include file='include/autosize.inc.tpl'}
{include file='include/dbselect.inc.tpl'}
{include file='include/datepicker.inc.tpl'}
+{known_script id="jquery.fcbkcomplete" src=$ROOT_URL|@cat:"template-common/lib/plugins/jquery.fcbkcomplete.js"}
+{literal}
+<script type="text/javascript">
+ $(document).ready(function() {
+ $("#tags").fcbkcomplete({
+ json_url: "admin.php?fckb_tags=1",
+ cache: false,
+ filter_case: true,
+ filter_hide: true,
+ firstselected: true,
+ filter_selected: true,
+ maxitems: 10,
+ newel: true
+ });
+ });
+</script>
+{/literal}
+
{literal}
<script type="text/javascript">
pwg_initialization_datepicker("#date_creation_day", "#date_creation_month", "#date_creation_year", "#date_creation_linked_date", "#date_creation_action_set");
@@ -119,7 +136,13 @@
<tr>
<td><strong>{'Tags'|@translate}</strong></td>
- <td>{$TAG_SELECTION}</td>
+ <td>
+<select id="tags" name="tags">
+{foreach from=$tags item=tag}
+ <option value="{$tag.value}" class="selected">{$tag.caption}</option>
+{/foreach}
+</select>
+ </td>
</tr>