doc/book/en/tutorials/base/discovering-the-ui.rst
branchstable
changeset 6837 7562418985ef
parent 6835 87e2641d75f7
equal deleted inserted replaced
6836:fb3633142d8f 6837:7562418985ef
     6 
     6 
     7 You can now access your web instance to create blogs and post messages
     7 You can now access your web instance to create blogs and post messages
     8 by visiting the URL http://localhost:8080/.
     8 by visiting the URL http://localhost:8080/.
     9 
     9 
    10 By default, anonymous access is disabled, so a login form will appear. If you
    10 By default, anonymous access is disabled, so a login form will appear. If you
    11 asked to allow anonymous access when initailizing the instance, click on the
    11 asked to allow anonymous access when initializing the instance, click on the
    12 'login' link in the top right hand corner. To login, you need then use the admin
    12 'login' link in the top right hand corner. To login, you need then use the admin
    13 account you specified at the time you initialized the database with
    13 account you specified at the time you initialized the database with
    14 ``cubicweb-ctl create``.
    14 ``cubicweb-ctl create``.
    15 
    15 
    16 .. image:: ../../images/tutos-base_login-form_en.png
    16 .. image:: ../../images/tutos-base_login-form_en.png
    25 
    25 
    26 
    26 
    27 Minimal configuration
    27 Minimal configuration
    28 ~~~~~~~~~~~~~~~~~~~~~
    28 ~~~~~~~~~~~~~~~~~~~~~
    29 
    29 
    30 Before creating entities, let's change that 'unset title' thing that appeared
    30 Before creating entities, let's change that 'unset title' thing that appears
    31 there and there. This is handled using |cubicweb| properties system. To set it,
    31 here and there. This comes from a |cubicweb| system properties. To set it,
    32 click on the 'site configuration link' in the pop-up menu behind your login name
    32 click on the 'site configuration link' in the pop-up menu behind your login name
    33 in the upper left-hand corner
    33 in the upper left-hand corner
    34 
    34 
    35 .. image:: ../../images/tutos-base_user-menu_en.png
    35 .. image:: ../../images/tutos-base_user-menu_en.png
    36    :alt: the user pop-up menu
    36    :alt: the user pop-up menu
    39 click the 'validate' button.
    39 click the 'validate' button.
    40 
    40 
    41 .. image:: ../../images/tutos-base_siteconfig_en.png
    41 .. image:: ../../images/tutos-base_siteconfig_en.png
    42    :alt: the site configuration form
    42    :alt: the site configuration form
    43 
    43 
    44 You should see a 'changes applied' message appear. You can now go back to the
    44 You should see a 'changes applied' message. You can now go back to the
    45 index page by clicking on the |cubicweb| logo in the upper left-hand corner.
    45 index page by clicking on the |cubicweb| logo in the upper left-hand corner.
    46 
    46 
    47 You will much likely still see 'unset title' at this point. This is because by
    47 You will much likely still see 'unset title' at this point. This is because by
    48 default the index page is cached. Force a refresh of the page (by typing Ctrl-R
    48 default the index page is cached. Force a refresh of the page (by typing Ctrl-R
    49 in firefox for instance) and you should now see the title you entered.
    49 in Firefox for instance) and you should now see the title you entered.
    50 
    50 
    51 
    51 
    52 Adding entities
    52 Adding entities
    53 ~~~~~~~~~~~~~~~
    53 ~~~~~~~~~~~~~~~
    54 
    54 
    55 The ``blog`` cube defines several entity types, among them ``Blog`` which is a
    55 The ``blog`` cube defines several entity types, among them ``Blog`` which is a
    56 container for ``BlogEntry`` (e.g. post) on a particular topic. We can get a
    56 container for ``BlogEntry`` (i.e. posts) on a particular topic. We can get a
    57 graphical view of the schema by clicking on the 'site schema' link in the user
    57 graphical view of the schema by clicking on the 'site schema' link in the user
    58 pop-up menu we've already seen:
    58 pop-up menu we've already seen:
    59 
    59 
    60 .. image:: ../../images/tutos-base_schema_en.png
    60 .. image:: ../../images/tutos-base_schema_en.png
    61    :alt: graphical view of the schema (aka data-model)
    61    :alt: graphical view of the schema (aka data-model)
    76 .. image:: ../../images/tutos-base_blog-form_en.png
    76 .. image:: ../../images/tutos-base_blog-form_en.png
    77    :alt: the blog creation form
    77    :alt: the blog creation form
    78 
    78 
    79 For instance, call this new blog 'Tech-blog' and type in 'everything about
    79 For instance, call this new blog 'Tech-blog' and type in 'everything about
    80 technology' as the description , then validate the form by clicking on
    80 technology' as the description , then validate the form by clicking on
    81 'Validate'. You'll be redirected to the `primary` view of the newly created blog.
    81 'Validate'. You will be redirected to the `primary` view of the newly created blog.
    82 
    82 
    83 .. image:: ../../images/tutos-base_blog-primary_en.png
    83 .. image:: ../../images/tutos-base_blog-primary_en.png
    84    :alt: the blog primary view
    84    :alt: the blog primary view
    85 
    85 
    86 
    86 
    87 Add a blog post
    87 Add a blog post
    88 ***************
    88 ***************
    89 
    89 
    90 There are several way to add a blog entry. The simplest is to click on the 'add
    90 There are several ways to add a blog entry. The simplest is to click on the 'add
    91 blog entry' link in the actions box on viewing the blog we've juste created.
    91 blog entry' link in the actions box on viewing the blog you have just created.
    92 You'll then see a form to create a post, with a 'blog entry of' selector preset
    92 You will then see a form to create a post, with a 'blog entry of' field preset
    93 to the blog we're coming from. Enter a title, some content, click the 'validate'
    93 to the blog we're coming from. Enter a title, some content, click the 'validate'
    94 button and you're done. You'll be redirected to the blog primary view, though you
    94 button and you're done. You will be redirected to the blog primary view, though you
    95 now see that it contains the blog post you've just created.
    95 now see that it contains the blog post you've just created.
    96 
    96 
    97 .. image:: ../../images/tutos-base_blog-primary-after-post-creation_en.png
    97 .. image:: ../../images/tutos-base_blog-primary-after-post-creation_en.png
    98    :alt: the blog primary view after creation of a post
    98    :alt: the blog primary view after creation of a post
    99 
    99 
   100 Notice there are some new boxes that appears in the left column.
   100 Notice there are some new boxes that appears in the left column.
   101 
   101 
   102 You can achieve the same thing by following the same path as we did for the blog
   102 You can achieve the same thing by following the same path as we did for the blog
   103 creation, e.g. by clicking on the `[+]` at the left of the 'Blog entry' link on
   103 creation, e.g. by clicking on the `[+]` at the left of the 'Blog entry' link on
   104 the index page. The diffence being that since there is now context information,
   104 the index page. The diffidence being that since there is no context information,
   105 the 'blog entry of' selector won't be preset to the blog.
   105 the 'blog entry of' selector won't be preset to the blog.
   106 
   106 
   107 
   107 
   108 If you click on the 'modify' link of the action box, you are back to the form to
   108 If you click on the 'modify' link of the action box, you are back to
   109 edit the entity you just created, except that the form now has another section
   109 the form to edit the entity you just created, except that the form now
   110 with a combo-box entitled 'add relation'. It provices a generic way to edit
   110 has another section with a combo-box entitled 'add relation'. It
   111 relations which don't appears in the above form. Choose the relation you want to
   111 provisos a generic way to edit relations which don't appears in the
   112 add and a second combobox appears where you can pick existing entities.  If there
   112 above form. Choose the relation you want to add and a second combo box
   113 are too much of them, you'll be proposed to navigate (so go away from the form to
   113 appears where you can pick existing entities.  If there are too many
   114 go back to it later, once you've selected the entity you want to link with).
   114 of them, you will be offered to navigate to the target entity, that is
       
   115 go away from the form and go back to it later, once you've selected
       
   116 the entity you want to link with.
   115 
   117 
   116 .. image:: ../../images/tutos-base_form-generic-relations_en.png
   118 .. image:: ../../images/tutos-base_form-generic-relations_en.png
   117    :alt: the generic relations combobox
   119    :alt: the generic relations combo box
   118 
   120 
   119 This combobox can't appear until the entity is actually created. That's why you
   121 This combo box can't appear until the entity is actually created. That's why you
   120 haven't seen it at creation time. You could also have hit 'Apply' instead of
   122 haven't seen it at creation time. You could also have hit 'Apply' instead of
   121 'validate' and it would have showed up.
   123 'validate' and it would have showed up.
   122 
   124 
   123 
   125 
   124 About ui auto-adaptation
   126 About ui auto-adaptation
   125 ~~~~~~~~~~~~~~~~~~~~~~~~
   127 ~~~~~~~~~~~~~~~~~~~~~~~~
   126 
   128 
   127 One thing among other that makes |cubicweb| different than other framework is
   129 One of the things that make |cubicweb| different of other frameworks is
   128 its automatic user interface that adapts itself according to the data being
   130 its automatic user interface that adapts itself according to the data being
   129 displayed. Let's see an example.
   131 displayed. Let's see an example.
   130 
   132 
   131 If you go back to the home page an click on the 'Blog' link, you'll be redirected
   133 If you go back to the home page an click on the 'Blog' link, you will be redirected
   132 to the primary view of the blog, the same we've seen earlier. Now, add another
   134 to the primary view of the blog, the same we've seen earlier. Now, add another
   133 blog, go back to the index page, and click again on this link. You'll see
   135 blog, go back to the index page, and click again on this link. You will see
   134 a very different view (namely the 'list' view).
   136 a very different view (namely the 'list' view).
   135 
   137 
   136 .. image:: ../../images/tutos-base_blogs-list_en.png
   138 .. image:: ../../images/tutos-base_blogs-list_en.png
   137    :alt: the list view when there are more than one blog to display
   139    :alt: the list view when there are more than one blog to display
   138 
   140 
   139 This is because in the first case, the framework choosed to use the 'primary'
   141 This is because in the first case, the framework chose to use the 'primary'
   140 view since there were only one entity in the data to be displayed. Now that there
   142 view since there was only one entity in the data to be displayed. Now that there
   141 are two entities, the 'list' view is more appropriate and hence has been used.
   143 are two entities, the 'list' view is more appropriate and hence is being used.
   142 
   144 
   143 There are various other places where it's able to adapt to display data in the best
   145 There are various other places where |cubicweb| adapts to display data in the best
   144 way, the main being provided by views *selection* mecanism that will be detailled
   146 way, the main being provided by the view *selection* mechanism that will be detailed
   145 later.
   147 later.
   146 
   148 
   147 
   149 
   148 Digging deeper
   150 Digging deeper
   149 ~~~~~~~~~~~~~~
   151 ~~~~~~~~~~~~~~
   150 
   152 
   151 By following principles explained below, you should now be able to create new
   153 By following principles explained below, you should now be able to
   152 user to your application, to configure with a finer grain, etc... You'll notice
   154 create new users for your application, to configure with a finer
   153 that the index page list a lot of types you don't know about. Most are built-in
   155 grain, etc... You will notice that the index page lists a lot of types
   154 type provided by the framework to make work the whole system. You may ignore them
   156 you don't know about. Most are built-in types provided by the framework
   155 in a first time and discover them as time goes.
   157 to make the whole system work. You may ignore them in a first time and
       
   158 discover them as time goes.
   156 
   159 
   157 One thing that is worth playing with is the search box. It may be used in various
   160 One thing that is worth playing with is the search box. It may be used in various
   158 way, from simple full text search to advanced queries using the :ref:`RQL` .
   161 way, from simple full text search to advanced queries using the :ref:`RQL` .