work in UI section in progress

docs/project-publishing.rst

@@ -54,6 +54,8 @@ First page of the wizard allows defining basic settings for publishing:
 
 .. figure:: ./img/project-publishing-0.png
 
+.. _publication-base-layers:
+
 By **base layers** are meant typically WMS layers provided by QGIS
 project. ``Base layer`` subpage also allows adding base layers provided by
 external services like OpenStreetMap, MapBox or Bing.
@@ -80,6 +82,8 @@ etc.
 
 .. figure:: ./img/project-publishing-3.png                        
 
+.. _publication-topics:
+
 In the following page **topics** can be defined. By topic it's meant
 group of thematically-related overlay layers. Topics can be easily
 switched in ``Topics`` tab of Gisquick UI, see :doc:`user-interface`

docs/user-interface.rst

@@ -1,25 +1,149 @@
-.. _environment-web:
+.. |group-switcher| image:: ./img/ui-layer-group-switcher.png
+   :width: 2.5em
+.. |layer-attributes| image:: ./img/ui-layer-attributes.png
+   :width: 2.5em
+.. |zoom-to| image:: ./img/ui-zoom-to.png
+   :width: 2.5em
+.. |clear-filter| image:: ./img/ui-clear-filter.png
+   :width: 2.5em
+.. |zoom-geolocation| image:: ./img/ui-zoom-tools-geolocation.png
+   :width: 2.5em
+.. |zoom-in-out| image:: ./img/ui-zoom-tools-in-out.png
+   :width: 2.5em
+.. |zoom-extent| image:: ./img/ui-zoom-tools-extent.png
+   :width: 2.5em
 
 ==============
 User Interface
 ==============
 
 Gisquick User Interface (UI) is designed to be simple,
 self-explanatory, and responsive. The major part is occupied of *map
-canvas* (``1``). On the left is located *content menu* (``2``) which
-is possible to hide by button on its right side (``3``). Corners of
-map canvas are filled by (from left-bottom corner, clockwise) by *map
-scale* (``4``), *tools menu* (``5``), *user menu* (``6``) and *zoom
-menu* (``7``). In the bottom part is located statusbar showing current
-scale, projection and map coordinates of the cursor (``8``).
+canvas* (``1``). On the left is located :ref:`content menu
+<content-menu>` (``2``) which is possible to hide by button on its
+right side (``3``). Corners of map canvas are filled by (from
+left-bottom corner, clockwise) by *map scale* (``4``), :ref:`tools
+menu <tool-menu>` (``5``), :ref:`user menu <user-menu>` (``6``) and
+:ref:`zoom menu <zoom-menu>` (``7``). In the bottom part is located
+statusbar showing current scale, projection and map coordinates of the
+cursor (``8``).
 
-.. figure:: ./img/gisquick-ui.png
+.. figure:: ./img/gisquick-ui.svg
+
+   Gisquick user interface description.
+
+.. _content-menu:
+
+------------------
+Content management
+------------------
+
+Basic project metadata - project description - is accessible by
+questionmark, see figure below.
+
+.. figure:: ./img/project-info.png
+
+   Project description.
+
+Content management widget is split into three major tabs:
+
+* Base Layers
+* Overlay Layers
+* Legend
+
+.. figure:: ./img/content-tabs.png
+
+   Content tabs.
+
+``Base Layers`` tab allows switching base layers in map canvas. The
+list of base layers is defined by publication process as described in
+:ref:`Project publishing <publication-base-layers>` section.
+
+.. figure:: ./img/ui-base-layers.png
+
+   Switching between base layers.
+
+``Overlay Layers`` tab allows switching between topics (layer groups),
+see :ref:`Project publishing <publication-topics>` section, or
+controlling overlay layers one by one.
+
+.. figure:: ./img/ui-overlay-layers.png
+
+   Topics or map layers switcher.
+
+.. figure:: ./img/ui-topics.png
+
+   Switching between topics.
+
+In ``Layers`` mode the overlay layers can be switch on/off one by one.
+
+.. figure:: ./img/ui-map-layers.png
+
+   Switch on/off overlayer layers.
+
+.. tip:: |tip| It is also possible to switch on/off group of layers
+   |group-switcher|.
+
+In this mode layer attribute data can be accessed by
+|layer-attributes|. Atrribute table is displayed in bottom part.
+
+.. figure:: ./img/ui-attributes.svg
+
+   Layer attribute table.
+
+Attribute table allows filtering data based on simple queries, see
+figures below.
+
+.. figure:: ./img/ui-attribute-filter-0.png
+   :width: 100px
+
+   Choose operator for attribute filter.
+
+.. figure:: ./img/ui-attribute-filter-1.svg
+
+   Define filter and ``refresh`` attribute table view.
+
+.. tip:: |tip| By default, attribute table shows only few records. The
+   number of displayed records can be controlled in status bar by
+   ``Rows by page``. Attributes can be also filter by map canvas
+   ``Filter to visible area``.
+
+Every record in attribute table has *Zoom to* button |zoom-to| which
+enables zooming and centering related features in map canvas, see
+example below.
+
+.. figure:: ./img/ui-zoom-to-feature.svg
+
+   Zoom into selected feature.
+
+.. note:: Filter can be disabled by |clear-filter|. Table view must be refreshed.
+
+.. todo:: Explain info panel.
+
+.. _zoom-menu:
 
-   Gisquick UI explanation.
 ----------
-Print tool
+Zoom tools
 ----------
 
+Zoom tools enables controling map view.
+
+* Geolocation |zoom-geolocation|
+* Zoom in/out |zoom-in-out|
+* Zoom to extent |zoom-extent|
+
+.. _tool-menu:
+
+-----
+Tools
+-----
+
+.. _print-tool:
+
+~~~~~~~~~~
+Print tool
+~~~~~~~~~~
+
 The main idea is, that once print is activated in Gisquick, it will
 download raw print output from QGIS Server using GetPrint request and
 will allow interactive visualization of map content directly in this
@@ -32,3 +156,8 @@ result will look like.  To get the better idea, see video below.
    <p>
 
 .. todo:: |todo| Web layout atď. ...
+
+---------
+User menu
+---------
+