From fb8b2153acbdfe42edd2dddbc10778812a60c869 Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Thu, 18 Nov 2010 20:04:57 +0300 Subject: [PATCH] update label editor --- PrefLabelTree.js | 51 +++++++ modules/pref-labels.php | 297 +++++++++++++++++----------------------- prefs.js | 166 +++++++--------------- tt-rss.css | 18 ++- 4 files changed, 241 insertions(+), 291 deletions(-) create mode 100644 PrefLabelTree.js diff --git a/PrefLabelTree.js b/PrefLabelTree.js new file mode 100644 index 000000000..47e18780a --- /dev/null +++ b/PrefLabelTree.js @@ -0,0 +1,51 @@ +dojo.provide("fox.PrefLabelTree"); + +dojo.require("lib.CheckBoxTree"); +dojo.require("dijit.form.DropDownButton"); + +dojo.declare("fox.PrefLabelTree", lib.CheckBoxTree, { + setNameById: function (id, name) { + var item = this.model.store._itemsByIdentity['LABEL:' + id]; + + if (item) + this.model.store.setValue(item, 'name', name); + + }, + _createTreeNode: function(args) { + var tnode = this.inherited(arguments); + + var fg_color = this.model.store.getValue(args.item, 'fg_color'); + var bg_color = this.model.store.getValue(args.item, 'bg_color'); + var type = this.model.store.getValue(args.item, 'type'); + var bare_id = this.model.store.getValue(args.item, 'bare_id'); + + if (type == 'label') { + var span = dojo.doc.createElement('span'); + span.innerHTML = 'α'; + span.className = 'labelColorIndicator2'; + span.id = 'LICID-' + bare_id; + + span.setStyle({ + color: fg_color, + backgroundColor: bg_color}); + + tnode._labelIconNode = span; + + dojo.place(tnode._labelIconNode, tnode.labelNode, 'before'); + } + + return tnode; + }, + getIconClass: function (item, opened) { + return (!item || this.model.mayHaveChildren(item)) ? (opened ? "dijitFolderOpened" : "dijitFolderClosed") : "invisible"; + }, + onClick: function (item) { + var id = String(item.id); + var bare_id = id.substr(id.indexOf(':')+1); + + if (id.match('LABEL:')) { + editLabel(bare_id, event); + } + }, +}); + diff --git a/modules/pref-labels.php b/modules/pref-labels.php index 467928416..386b9c6a2 100644 --- a/modules/pref-labels.php +++ b/modules/pref-labels.php @@ -3,6 +3,114 @@ $subop = $_REQUEST["subop"]; + if ($subop == "edit") { + $label_id = db_escape_string($_REQUEST['id']); + + header("Content-Type: text/xml"); + print ""; + print "" . __("Label Editor") . ""; + print "".__("Caption").""; + + print "
"; + + print "" . $line["caption"] . + " + "; + + print "
"; + print "
" . __("Change colors") . "
"; + print "
"; + + print ""; + + print "
"; + + print "
".__("Foreground color:")."".__("Background color:"). + "
"; + + print "
+ +
"; + print ""; + + print "		"; + + print "
+ +
"; + print ""; + + print "
"; + print "
"; + + print "
"; + print ""; + print "
"; + + print "]]>"; + return; + } + + if ($subop == "getlabeltree") { + $root = array(); + $root['id'] = 'root'; + $root['name'] = __('Labels'); + $root['items'] = array(); + + $result = db_query($link, "SELECT * + FROM ttrss_labels2 + WHERE owner_uid = ".$_SESSION["uid"]." + ORDER BY caption"); + + while ($line = db_fetch_assoc($result)) { + $label = array(); + $label['id'] = 'LABEL:' . $line['id']; + $label['bare_id'] = $line['id']; + $label['name'] = $line['caption']; + $label['fg_color'] = $line['fg_color']; + $label['bg_color'] = $line['bg_color']; + $label['type'] = 'label'; + $label['checkbox'] = false; + + array_push($root['items'], $label); + } + + $fl = array(); + $fl['identifier'] = 'id'; + $fl['label'] = 'name'; + $fl['items'] = array($root); + + print json_encode($fl); + return; + } + if ($subop == "color-set") { $kind = db_escape_string($_REQUEST["kind"]); $ids = split(',', db_escape_string($_REQUEST["ids"])); @@ -154,21 +262,12 @@ print "
"; print "
"; - print "
- - -
"; - print "
". "" . __('Select').""; print "
"; - print "
".__('All')."
"; - print "
".__('None')."
"; print "
"; @@ -186,170 +285,26 @@ print "
"; #pane print "
"; - if ($label_search) { + print "
+ ". + __("Loading, please wait...")."
"; - $label_search = split(" ", $label_search); - $tokens = array(); - - foreach ($label_search as $token) { - - $token = trim($token); - array_push($tokens, "(UPPER(caption) LIKE UPPER('%$token%'))"); - - } - - $label_search_query = "(" . join($tokens, " AND ") . ") AND "; - - } else { - $label_search_query = ""; - } - - $result = db_query($link, "SELECT - * - FROM - ttrss_labels2 - WHERE - $label_search_query - owner_uid = ".$_SESSION["uid"]." - ORDER BY $sort"); - - if (db_num_rows($result) != 0) { - - print "

"; - - $lnum = 0; - - while ($line = db_fetch_assoc($result)) { - - $class = ($lnum % 2) ? "even" : "odd"; - - $label_id = $line["id"]; - $this_row_id = "id=\"LILRR-$label_id\""; - - print ""; - - $line["caption"] = htmlspecialchars($line["caption"]); - - $fg_color = $line["fg_color"]; - $bg_color = $line["bg_color"]; - - if (!$fg_color) $fg_color = ""; - if (!$bg_color) $bg_color = ""; - - print ""; - - $id = $line['id']; - - print ""; - - print ""; - - ++$lnum; - } - - print "
"; - - print "
α"; - print_color_picker($id); - print "
"; - - print "" . $line["caption"] . - " - "; - - print "
"; - - - } else { - print "

"; - if (!$label_search) { - print_warning(__('No labels defined.')); - } else { - print_warning(__('No matching labels found.')); - } - print "

"; - - } + print "
+
+
+
+
+ +
"; print "
"; #pane print "
"; #container } - function print_color_picker($id) { - - print ""; - } - ?> diff --git a/prefs.js b/prefs.js index 30b587775..c959e5dfa 100644 --- a/prefs.js +++ b/prefs.js @@ -6,10 +6,6 @@ var caller_subop = false; var hotkey_prefix = false; var hotkey_prefix_pressed = false; -var color_picker_active = false; -var selection_disabled = false; -var mouse_is_down = false; - var seq = ""; function feedlist_callback2(transport) { @@ -358,7 +354,15 @@ function editFeed(feed, event) { } function getSelectedLabels() { - return getSelectedTableRowIds("prefLabelList"); + var tree = dijit.byId("labelTree"); + var items = tree.model.getCheckedItems(); + var rv = []; + + items.each(function(item) { + rv.push(tree.model.store.getValue(item, 'bare_id')); + }); + + return rv; } function getSelectedUsers() { @@ -1061,8 +1065,6 @@ function init_second_stage() { try { document.onkeydown = pref_hotkey_handler; - document.onmousedown = mouse_down_handler; - document.onmouseup = mouse_up_handler; caller_subop = getURLParam('subop'); @@ -1119,6 +1121,7 @@ function init() { dojo.require("dijit.Menu"); dojo.require("dijit.tree.dndSource"); dojo.require("dijit.InlineEditBox"); + dojo.require("dijit.ColorPalette"); dojo.registerModulePath("lib", ".."); dojo.registerModulePath("fox", "../.."); @@ -1126,6 +1129,7 @@ function init() { dojo.require("lib.CheckBoxTree"); dojo.require("fox.PrefFeedTree"); dojo.require("fox.PrefFilterTree"); + dojo.require("fox.PrefLabelTree"); loading_set_progress(30); @@ -1201,7 +1205,6 @@ function pref_hotkey_handler(e) { if (Element.visible("hotkey_help_overlay")) { Element.hide("hotkey_help_overlay"); } - colorPickerHideAll(); hotkey_prefix = false; closeInfoBox(); } @@ -1465,11 +1468,6 @@ function changeUserEmail() { } -function feedlistToggleSLAT() { - notify_progress("Loading, please wait..."); - updateFeedList() -} - function opmlRegenKey() { try { @@ -1781,130 +1779,44 @@ function labelColorReset() { } } -function labelColorAsk(id, kind) { +function setLabelColor(id, fg, bg) { try { - var p = null + var kind = ''; + var color = ''; - if (kind == "fg") { - p = prompt(__("Please enter new label foreground color:")); - } else { - p = prompt(__("Please enter new label background color:")); + if (fg && bg) { + kind = 'both'; + } else if (fg) { + kind = 'fg'; + color = fg; + } else if (bg) { + kind = 'bg'; + color = bg; } - if (p != null) { - - var query = "?op=pref-labels&subop=color-set&kind=" + kind + - "&ids="+ param_escape(id) + "&color=" + param_escape(p); - - selectTableRows('prefLabelList', 'none'); - - var e = $("LICID-" + id); - - if (e) { - if (kind == "fg") { - e.style.color = p - } else { - e.style.backgroundColor = p; - } - } - - new Ajax.Request("backend.php", { parameters: query }); - } - - } catch (e) { - exception_error("labelColorReset", e); - } -} - - -function colorPicker(id, fg, bg) { - try { - var picker = $("colorPicker-" + id); - - if (picker) Element.show(picker); - - } catch (e) { - exception_error("colorPicker", e); - } -} - -function colorPickerHideAll() { - try { - if ($("prefLabelList")) { - - var elems = $("prefLabelList").getElementsByTagName("DIV"); - - for (var i = 0; i < elems.length; i++) { - if (elems[i].id && elems[i].id.match("colorPicker-")) { - Element.hide(elems[i]); - } - } - } - - } catch (e) { - exception_error("colorPickerHideAll", e); - } -} - -function colorPickerDo(id, fg, bg) { - try { - - var query = "?op=pref-labels&subop=color-set&kind=both"+ + var query = "?op=pref-labels&subop=color-set&kind="+kind+ "&ids=" + param_escape(id) + "&fg=" + param_escape(fg) + - "&bg=" + param_escape(bg); + "&bg=" + param_escape(bg) + "&color=" + param_escape(color); + +// console.log(query); var e = $("LICID-" + id); if (e) { - e.style.color = fg; - e.style.backgroundColor = bg; + if (fg) e.style.color = fg; + if (bg) e.style.backgroundColor = bg; } new Ajax.Request("backend.php", { parameters: query }); + updateFilterList(); + } catch (e) { exception_error("colorPickerDo", e); } } -function colorPickerActive(b) { - color_picker_active = b; -} - -function mouse_down_handler(e) { - try { - - /* do not prevent right click */ - if (e && e.button && e.button == 2) return; - - if (selection_disabled) { - document.onselectstart = function() { return false; }; - return false; - } - - } catch (e) { - exception_error("mouse_down_handler", e); - } -} - -function mouse_up_handler(e) { - try { - mouse_is_down = false; - - if (!selection_disabled) { - document.onselectstart = null; - } - - if (!color_picker_active) { - colorPickerHideAll(); - } - - } catch (e) { - exception_error("mouse_up_handler", e); - } -} - function inPreferences() { return true; } @@ -2051,3 +1963,21 @@ function editCat(id, item, event) { exception_error("editCat", e); } } + +function editLabel(id, event) { + try { + var query = "?op=pref-labels&subop=edit&id=" + + param_escape(id); + + notify_progress("Loading, please wait...", true); + + new Ajax.Request("backend.php", { + parameters: query, + onComplete: function(transport) { + infobox_callback2(transport); + } }); + + } catch (e) { + exception_error("editLabel", e); + } +} diff --git a/tt-rss.css b/tt-rss.css index 0eba89c13..55c1871a7 100644 --- a/tt-rss.css +++ b/tt-rss.css @@ -1284,6 +1284,20 @@ span.labelColorIndicator { margin-right : 2px; } +span.labelColorIndicator2 { + height : 14px; + width : 14px; + font-height : 9px; + display : inline-block; + border : 1px solid black; + background-color : #fff7d5; + color : #063064; + text-align : center; + margin-right : 2px; + vertical-align : bottom; +} + + div.labelColorIndicator { height : 14px; width : 14px; @@ -1543,13 +1557,13 @@ img.feedIcon, img.tinyFeedIcon { height : 16px; } -div#feedlistLoading, div#filterlistLoading { +div#feedlistLoading, div#filterlistLoading, div#labellistLoading { text-align : center; padding : 5px; color : gray; } -div#feedlistLoading img, div#filterlistLoading img { +div#feedlistLoading img, div#filterlistLoading img, div#labellistLoading { margin-right : 5px; }