Usage
=====

.. image:: _static/mainview.jpg
   :width: 640


The *tagit* screen mostly shows a search bar and a browser.

The *search bar* lists the tokens of your search query in the order that you've added them (via the filter button |buttons_filter_add|).
You can nagivate through the tokens (use the arrow buttons |buttons_filter_back| |buttons_filter_forth|) to switch between different searches.
Note that *tagit* remembers your selection and focus at every step.
The active search tokens are highlighted and dangling tokens are greyed out.

The *browser* shows the search results and lets you scroll and select them.
On the left hand side, you'll find some buttons to add or edit image's tags (
|buttons_tagging_add_tag|,
|buttons_tagging_edit_tag|),
to create search tokens from your selection (
|buttons_search_exclusive_filter|,
|buttons_search_exclude_filter|
),
and to navigate and edit your selection (
|buttons_browser_select_all|,
|buttons_browser_select_none|,
|buttons_browser_select_invert|,
|buttons_browser_select_single|,
|buttons_browser_select_range|,
|buttons_browser_select_multi|,
|buttons_browser_select_add|,
|buttons_browser_select_sub|
).
Note that on a desktop environment you can use your keyboard to select items like in most browsers, e.g, CTRL to select individual items or SHIFT to select a range.
The box on the right shows you some information about the currently selected item.
The navigation buttons at the bottom let you scroll through the browser's pages (
|buttons_browser_cursor_first|,
|buttons_browser_previous_page|,
|buttons_browser_scroll_up|
|buttons_browser_scroll_down|,
|buttons_browser_next_page|,
|buttons_browser_cursor_last|,
).

The following video guides you through the some common functionality:

.. video:: _static/usage.webm
   :width: 640



.. |buttons_filter_add| image:: ../../tagit/assets/icons/kivy/filter/add.png
   :width: 20

.. |buttons_filter_back| image:: ../../tagit/assets/icons/kivy/filter/go_back.png
   :width: 20

.. |buttons_filter_forth| image:: ../../tagit/assets/icons/kivy/filter/go_forth.png
   :width: 20

.. |buttons_browser_cursor_first| image:: ../../tagit/assets/icons/kivy/browser/cursor_first.png
   :width: 20

.. |buttons_browser_cursor_last| image:: ../../tagit/assets/icons/kivy/browser/cursor_last.png
   :width: 20

.. |buttons_browser_next_page| image:: ../../tagit/assets/icons/kivy/browser/next_page.png
   :width: 20

.. |buttons_browser_previous_page| image:: ../../tagit/assets/icons/kivy/browser/previous_page.png
   :width: 20

.. |buttons_browser_scroll_down| image:: ../../tagit/assets/icons/kivy/browser/scroll_down.png
   :width: 20

.. |buttons_browser_scroll_up| image:: ../../tagit/assets/icons/kivy/browser/scroll_up.png
   :width: 20

.. |buttons_browser_select_all| image:: ../../tagit/assets/icons/kivy/browser/select_all.png
   :width: 20

.. |buttons_browser_select_none| image:: ../../tagit/assets/icons/kivy/browser/select_none.png
   :width: 20

.. |buttons_browser_select_invert| image:: ../../tagit/assets/icons/kivy/browser/select_invert.png
   :width: 20

.. |buttons_browser_select_single| image:: ../../tagit/assets/icons/kivy/browser/select_single.png
   :width: 20

.. |buttons_browser_select_range| image:: ../../tagit/assets/icons/kivy/browser/select_range.png
   :width: 20

.. |buttons_browser_select_multi| image:: ../../tagit/assets/icons/kivy/browser/select_multi.png
   :width: 20

.. |buttons_browser_select_add| image:: ../../tagit/assets/icons/kivy/browser/select_add.png
   :width: 20

.. |buttons_browser_select_sub| image:: ../../tagit/assets/icons/kivy/browser/select_sub.png
   :width: 20

.. |buttons_tagging_add_tag| image:: ../../tagit/assets/icons/kivy/tagging/add_tag.png
   :width: 20

.. |buttons_tagging_edit_tag| image:: ../../tagit/assets/icons/kivy/tagging/edit_tag.png
   :width: 20

.. |buttons_search_exclusive_filter| image:: ../../tagit/assets/icons/kivy/search/exclusive_filter.png
   :width: 20

.. |buttons_search_exclude_filter| image:: ../../tagit/assets/icons/kivy/search/exclude_filter.png
   :width: 20