Toolbar: Add the more panel feature in toolbar. When it is the ELM_TOOLBAR_SHRINK_EXP...
[framework/uifw/elementary.git] / doc / examples.dox
index fda24f3..af803e0 100644 (file)
  *
  * @ref clock_example
  *
+ * @ref datetime_example
+ *
+ * @ref dayselector_example
+ *
  * @ref mapbuf_example
 
  * @ref map_example_01
@@ -49,6 +53,8 @@
  *
  * @ref diskselector_example_02
  *
+ * @ref entry_example
+ *
  * @ref list_example_01
  *
  * @ref list_example_02
@@ -87,6 +93,8 @@
  *
  * @ref genlist_example_05
  *
+ * @ref glview_example_01_page
+ *
  * @ref thumb_example_01
  *
  * @ref progressbar_example
  * @skip size_hint_weight_set
  * @until resize_object_add
  *
- * See @ref evas_object_size_hint_weight_set and elm_win_resize_object_add()
+ * See evas_object_size_hint_weight_set() and elm_win_resize_object_add()
  * for more detailed info about these functions.
  *
  * The end of the example is quite simple, just setting the minimum and
  */
 
  /**
+  * @page button_example_00 Button - Hello, Button!
+  *
+  * @dontinclude button_example_00.c
+  *
+  * Keeping the tradition, this is a simple "Hello, World" button example. We
+  * will show how to create a button and associate and action to be performed
+  * when you click on it.
+  *
+  * In the end, we'll be presented with something that looks like this:
+  *
+  * @image html screenshots/button_00.png
+  * @image latex screenshots/button_00.eps width=\textwidth
+  *
+  * The full code of the example is @ref button_example_00.c "here" and we
+  * will follow here with a rundown of it.
+  *
+  *
+  * There is only one button on the interface which performs a basic action:
+  * close the application. This behavior is described by on_click() function,
+  * that interrupt the program invoking elm_exit().
+  * @skip static void
+  * @until }
+  *
+  *
+  * On the main() function, we set the basic characteristics of the user
+  * interface. First we use the Elementary library to create a window and
+  * set its policies (such as close when the user click on the window close
+  * icon).
+  *
+  * @skip elm_win_add
+  * @until elm_policy_set
+  *
+  * In order to turn it visible on the WM (Window Manager), we also have to
+  * associate it to a canvas through Evas library, and set its dimensions.
+  *
+  * @skip evas_object_resize
+  * @until evas_object_show(win)
+  *
+  * Then we create a background associated to the window, define its dimensions,
+  * and turn it visible on the canvas.
+  * @skip  elm_bg_add
+  * @until evas_object_show(bg)
+  *
+  *
+  * Finally we use Elementary to create a button and Evas to set its
+  * proprieties. Here we have not only to give the button dimensions, but also
+  * its coordinates and the action to be performed on the click event.
+  * @skip elm_button_add
+  * @until evas_object_show(btn)
+  *
+  *
+  * And we are done.
+  *
+  * @example button_example_00.c
+  */
+
+/**
   * @page button_example_01 Button - Complete example
   *
   * @dontinclude button_example_01.c
  *
  * To set weekday names, we should declare them as an array of strings:
  * @dontinclude calendar_example_02.c
- * @skipline weekdays
+ * @skipline weekdays[]
  * @until }
  *
  * And finally set them to calendar:
- * skipline weekdays_names_set
+ * @skipline weekdays_names_set
  *
  * Our example will look like this:
  *
  * If isn't required that users could select a day on calendar,
  * only interacting going through months, disabling days selection
  * could be a good idea to avoid confusion. For that:
- * @skipline elm_calendar_day_selection_enabled_set
+ * @skipline elm_calendar_day_selection_disabled_set
  *
  * Also, regarding days selection, you could be interested to set a
  * date to be highlighted on calendar from your code, maybe when
- * a specific event happens, or after calendar creation. Let's select
- * two days from current day:
+ * a specific event happens, or after calendar creation. As @c time output is
+ * in seconds, we define the number of seconds contained within a day as a
+ * constant:
  * @dontinclude calendar_example_04.c
  * @skipline SECS_DAY
- * @skipline current_time
+ *
+ * Now let's select two days from current day:
+ * @skipline time(NULL)
  * @until elm_calendar_selected_time_set
  *
  * Our example will look like this:
  * be read on @c ctime manpage.
  * If a date relative from current is required, this struct can be set
  * as:
- * @skipline current_time
+ * @skipline time(NULL)
  * @until localtime_r
  *
  * Or if it's an absolute date, you can just declare the struct like:
  * Periodicity is how frequently the mark will be displayed over the
  * calendar.  Can be a unique mark (that don't repeat), or it can repeat
  * daily, weekly, monthly or annually. It's enumerated by
- * @c Elm_Calendar_Mark_Repeat.
+ * @c Elm_Calendar_Mark_Repeat_Type.
  *
  * So let's add some marks to our calendar. We will add christmas holiday,
  * set Sundays as holidays, and check current day and day after that.
  * If some decoration is required, a label can be set, and icon before and
  * after the bar as well. On the second slider will add a @c home icon
  * and a @c folder icon at @c end.
- * @skipline text_set
- * @until end_set
+ * @skip elm_object_text_set
+ * @until elm_object_part_content_set(sl, "end", ic)
  *
  * If the bar size need to be changed, it can be done with span set function,
  * that doesn't accounts other widget's parts size. Also the bar can starts
  *
  * The fifth, besides editable, has only the time @b units editable,
  * for hours, minutes and seconds. This exemplifies
- * elm_clock_digit_edit_set():
+ * elm_clock_edit_mode_set():
  * @dontinclude clock_example.c
  * @skip but only
  * @until evas_object_show
  */
 
 /**
+ * @page datetime_example Datetime widget example
+ *
+ * This code places three Elementary Datetime widgets on a window, each of
+ * them exemplifying the widget's different usage.
+ *
+ * The first of them is <b>"only Date display"</b>:
+ * @dontinclude datetime_example.c
+ * @skip only DATE
+ * @until evas_object_show
+ *
+ * For <b>"only Time display"</b>, see the second datetime:
+ * @dontinclude datetime_example.c
+ * @skip only TIME
+ * @until evas_object_show
+ *
+ * The third one will display datetime shows both <b>Date and Time</b>, corresponding format will be
+ * taken from system @b locale. Note, besides, that the strings are different
+ *  for different language settings.
+ *
+ * <b>Datetime format</b> can be programmatically set by using 
+ * elm_datetime_format_set():
+ * @dontinclude datetime_example.c
+ * @skip DATE and TIME
+ * @until evas_object_show
+ * The default format of any locale consists:
+ * - Year Field
+ * - Month Field
+ * - Date Field
+ * - Hour Field(12hr/24hr format)
+ * - Minute Field
+ * - AM/PM (if exists).
+ *
+ * This is how the example program's window looks like with the datetime widget
+ * showing only date, only time and both date & time:
+ *
+ * @image html screenshots/datetime_example.png
+ * @image latex screenshots/datetime_example.eps width=\textwidth
+ *
+ * See the full @ref datetime_example_c "source code" for
+ * this example.
+ *
+ * @example datetime_example.c
+ */
+
+/**
+ * @page dayselector_example Dayselector widget example
+ *
+ * This code places two Elementary dayselector widgets on a window, each of
+ * them exemplifying the different widget styles.
+ *
+ * The first of them is the dayselector in default style:
+ * @dontinclude dayselector_example.c
+ * @skip weekdays starting from Sunday
+ * @until evas_object_show
+ *
+ * As you see, the default style displays the weekdays starting from Sunday.
+ *
+ * One can select/unselect a day just by clicking on the day object.
+ * The selection toggles once it is being pressed.
+ *
+ *
+ * For showing weekdays starting from Monday, see the second dayselector:
+ * @dontinclude dayselector_example.c
+ * @skip weekdays starting from Monday
+ * @until evas_object_show
+ *
+ *
+ * The following code exemplifies the selection APIs of Dayselector:
+ * @dontinclude dayselector_example.c
+ * @skip Callback function
+ * @until End of clicked callback
+ *
+ *
+ * See the full @ref dayselector_example.c "example", whose window should
+ * look like this picture:
+ *
+ * @image html screenshots/dayselector_example.png
+ * @image latex screenshots/dayselector_example.eps width=\textwidth
+ *
+ * See the full @ref dayselector_example_c "source code" for this example.
+ *
+ * @example dayselector_example.c
+ */
+
+/**
  * @page mapbuf_example Mapbuf Widget Example
  *
  * This code places a Elementary mapbuf widget on a window,
  *
  * By default map is disabled. So just setting content isn't enough.
  * Alpha and smooth settings will be applied when map is enabled.
- * So we'll add a toggle for that. Everytime the map properties
+ * So we'll add a check for that. Everytime the map properties
  * are changed, map will need to be enabled again. So if you
  * want to play a bit with our example, remember to always enable
  * map again after concluding your changes.
- * @skipline toggle_add
+ * @skipline check_add
  * @until show
  *
- * We have added a callback function to this toggle, so it will enable
+ * We have added a callback function to this check, so it will enable
  * or disable map:
  * @dontinclude mapbuf_example.c
  * @skip static
  * By default, mapbuf would enable alpha blending and smooth rendering,
  * so we need to check boxes to be consistent with its behavior.
  *
- * Callback functions look like the one added to the toggle. This way we
+ * Callback functions look like the one added to the check. This way we
  * could enable or disable the both properties:
  * @dontinclude mapbuf_example.c
  * @skip static
  * conversion
  * util functions, so we could get coordinates for this address. These
  * functions return an #Elm_Map_Name handle for us.
- * Function elm_map_utils_convert_name_into_coord() will do this job for us,
+ * Function elm_map_name_geo_request() will do this job for us,
  * but it's an assyncronous function, since it requires this
  * information from the server.
  *
  * diskselector will display first item after last, and last previous to
  * the first one. So, as you can see, @b Sa will appears on left side
  * of selected @b Sunday. This property is set with
- * elm_diskselector_round_set().
+ * elm_diskselector_round_enabled_set().
  *
  * Also, we decide to display only 2 character for side labels, instead of 3.
- * For this we call elm_diskselector_side_label_length_set(). As result,
+ * For this we call elm_diskselector_side_text_max_length_set(). As result,
  * we'll see @b Mo displayed instead of @b Mon, when @b Monday is on a
  * side position.
  *
  * is enough to call elm_diskselector_display_item_num_set(), as you can
  * see here:
  * @skipline elm_diskselector_add
- * @until evas_object_show
+ * @until elm_diskselector_display_item_num_set
  *
  * @note You can't set less than 3 items to be displayed.
  *
  * You can get the number of items in the diskselector by calling
  * elm_diskselector_display_item_num_get(), as you can see here:
- * @skipline elm_diskselector_add
+ * @skipline elm_diskselector_display_item_num_get
  *
  * Finally, if a bounce effect is required, or you would like to see
  * scrollbars, it is possible. But, for default theme, diskselector
  *
  * <b> Deleting an item: </b>
  * @dontinclude diskselector_example_02.c
- * @skip _del_cb
- * @skipline _del_cb
+ * @skipline _del_cb(void
  * @until }
  *
  * To delete an item we simple need to call elm_object_item_del() with
  * since we'll explain it better on  @ref list_example_03. But if the callback
  * need to be called everytime user clicks an item, even if already selected,
  * it's required to enable this behavior:
- * @skipline elm_list_always_select_mode_set
+ * @skipline elm_list_select_mode_set
  *
  * Finally, if a bounce effect is required, or you would like to see
  * scrollbars, it is possible. But, for default theme, list
  *
  * If you want to free this data, or handle that the way you need when the
  * item is deleted, set a callback function for that, with
- * elm_list_item_del_cb_set().
+ * elm_object_item_del_cb_set().
  *
  * As you can see we check if @c it is not @c NULL after appending it.
  * If an error happens, we won't try to set a function for it.
  * events occur, and they will just print something to @c stdout:
  * @dontinclude flipselector_example.c
  * @skip underflow callback
- * @until static void
+ * @until }
+ * @until }
  * Flip the sheets on the widget while looking at the items list, in
  * the source code, and you'll get the idea of those events.
  *
  *
  * @dontinclude flipselector_example.c
  * @skip unselect the item
- * @until underflow
+ * @until }
+ * @until }
  *
  * Click on them to exercise those flip selector API calls. To
  * interact with the other parts of this API, there's a command line
  */
 
 /**
+  * @page glview_example_01_page - GLView Example
+  * @include glview_example_01.c
+  */
+
+/**
   * @page tutorial_flip Flip example
   * @dontinclude flip_example_01.c
   *
   * elm_image_no_scale_set() is used just to set this value to true (we
   * don't want to scale our image anyway, just resize it).
   *
-  * elm_image_scale_set() is used to allow the image to be resized to a size
+  * elm_image_resizable_set() is used to allow the image to be resized to a size
   * smaller than the original one, but not to a size bigger than it.
   *
   * elm_elm_image_smooth_set() will disable the smooth scaling, so the scale
   * elm_icon_no_scale_set() is used just to set this value to true (we
   * don't want to scale our icon anyway, just resize it).
   *
-  * elm_icon_scale_set() is used to allow the icon to be resized to a size
+  * elm_icon_resizable_set() is used to allow the icon to be resized to a size
   * smaller than the original one, but not to a size bigger than it.
   *
   * elm_elm_icon_smooth_set() will disable the smooth scaling, so the scale
  * And now we create our hoversel and set some of it's properties. We set @p win
  * as its parent, ask it to not be horizontal(be vertical) and give it a label
  * and icon:
- * @until icon_set
+ * @until "icon", rect)
  *
  * Next we will add our three items, setting a callback to be called for the
  * first and third:
  * item pointed to by that index item. When one releases the mouse
  * button, the second callback takes place. There, we check that the
  * reported item data, on @c event_info, is the same reported by
- * elm_index_item_selected_get(), which gives the last selection's
+ * elm_index_selected_item_get(), which gives the last selection's
  * data on the index widget.
  *
  * The first of the three buttons that follow will call
- * elm_index_active_set(), thus showing the index automatically for
+ * elm_index_autohide_disabled_set(), thus showing the index automatically for
  * you, if it's not already visible, what is checked with
- * elm_index_active_get(). The second button will exercise @b deletion
+ * elm_index_autohide_disabled_get(). The second button will exercise @b deletion
  * of index item objects, by the following code:
  * @dontinclude index_example_01.c
  * @skip delete an index item
  * @image html screenshots/index_example_03.png
  * @image latex screenshots/index_example_03.eps
  *
- * See the full @ref index_example.c "source code" for
+ * See the full @ref index_example_02.c "source code" for
  * this example.
  *
  * @example index_example_02.c
  */
 
 /**
- * @page tutorial_toggle Toggle example
- * @dontinclude toggle_example_01.c
- *
- * In this example we'll create 2 toggle widgets. The first will have an icon
- * and the state names will be the default "on"/"off", it will also change the
- * value of a variable directly. The second won't have a icon, the state names
- * will be "Enabled"/"Disabled", it will  start "Enabled" and it won't set the
- * value of a variable.
- *
- * We start with the usual includes and prototype for callback which will be
- * implemented and detailed later on:
- * @until _cb2
- *
- * We then declare a static global variable(the one whose value will be changed
- * by the first toggle):
- * @until static
- *
- * We now have to create our window and all that usual stuff:
- * @until show(bx)
- *
- * The creation of a toggle is no more complicated than that of any other
- * widget:
- * @until add
- *
- * For our first toggle we don't set the states labels so they will stay the
- * default, however we do set a label for the toggle, an icon and the variable
- * whose value it should change:
- * @until show
- *
- * We also set the callback that will be called when the toggles value changes:
- * @until smart_callback
- *
- * For our second toggle it important to note that we set the states labels,
- * don't set an icon or variable, but set the initial state to
- * EINA_TRUE("Enabled"):
- * @until show
- *
- * For the second toggle we will use a different callback:
- * @until smart_callback
- *
- * We then ask the main loop to start:
- * @until ELM_MAIN
- *
- * The callback for our first toggle will look the value of @p val and print it:
- * @until }
- *
- * For our second callback we need to do a little bit more, since the second
- * toggle doesn't change the value of a variable we have to ask it what its
- * state is:
- * @until }
- *
- * This example will look like this:
- *
- * @image html screenshots/toggle_example_01.png
- * @image latex screenshots/toggle_example_01.eps width=\textwidth
- *
- * @example toggle_example_01.c
- */
-
-/**
  * @page tutorial_panel Panel example
  * @dontinclude panel_example_01.c
  *
  * you'll notice all subsequent clicks on the @b same grid item will
  * still issue the selection callback on it, what is different from
  * when it's not checked. This is the
- * elm_gengrid_always_select_mode_set() behavior:
+ * elm_gengrid_select_mode_set() behavior:
  * @dontinclude gengrid_example.c
  * @skip "always select" callback
  * @until }
  * @example gengrid_example.c
  */
 /**
- * @page entry_example_01 Entry - Example of simple editing
+ * @page entry_example Entry - Example of simple editing
  *
  * As a general overview of @ref Entry we are going to write an, albeit simple,
  * functional editor. Although intended to show how elm_entry works, this
  * and the entry itself doesn't, yet, support all the needed capabilities to
  * make this simpler. We begin by getting the format we are using in our
  * function from the button pressed.
- * @skip aid->naviframe = naviframe;
+ * @skip  _format_change_cb(void *data, Evas_Object *obj, void *event __UNUSED__)
  * @until sizeof(fmt_close)
  *
  * Next we need to find out if we need to insert an opening or a closing tag.
  * We are going to change some of the properties of our list.
  *
  * There's no need to call the selected callback at every click, just when the
- * selected item changes, thus we call elm_genlist_always_select_mode_set() with
- * false.
+ * selected item changes, thus we call elm_genlist_select_mode_set() with
+ * ELM_OBJECT_SELECT_MODE_ALWAYS.
  *
  * For this list we don't want bounce animations at all, so we set both the
  * horizontal bounce and the vertical bounce to false with
  * elm_genlist_bounce_set().
  *
  * We also want our list to compress items if they are wider than the list
- * width (thus we call elm_genlist_compress_mode_set().
+ * width (thus we call elm_genlist_mode_set(obj, ELM_LIST_COMPRESS).
  *
  * The items have different width, so they are not homogeneous:
  * elm_genlist_homogeneous_set() is set to false.
  * This list will support multiple selection, so we call
  * elm_genlist_multi_select_set() on it.
  *
- * The option elm_genlist_height_for_width_mode_set() would allow text block to
+ * The option elm_genlist_mode_set() would allow text block to
  * wrap lines if the Edje part is configured with "text.min: 0 1", for example.
  * But since we are compressing the elements to the width of the list, this
  * option wouldn't take any effect.
  * However, if the @c item1 didn't have any child previously, we have to change
  * it to a parent item now. It would be easy to just change its item class to
  * the parent type, but there's no way to change the item flags and make it be
- * of the type #ELM_GENLIST_ITEM_SUBITEMS. Thus, we have to delete it and create
+ * of the type #ELM_GENLIST_ITEM_TREE. Thus, we have to delete it and create
  * a new item, and add this new item to the same position that the deleted one
  * was. That's the reason of the checks inside the bigger @c if.
  *
  */
 
 /**
+ * @page popup_example_01_c popup_example_01.c
+ * @include popup_example_01.c
+ *
+ * This example will initially look like this:
+ *
+ * @image html screenshots/popup_example_01.png
+ * @image latex screenshots/popup_example_01.eps width=\textwidth
+ *
+ * Once the popup is hidden after timeout:
+ *
+ * @image html screenshots/popup_example_01_a.png
+ * @image latex screenshots/popup_example_01_a.eps width=\textwidth
+ *
+ * @example popup_example_01.c
+ */
+
+ /** @page popup_example_02_c popup_example_02.c
+ * @include popup_example_02.c
+ *
+ * This example will look like this:
+ *
+ * @image html screenshots/popup_example_02.png
+ * @image latex screenshots/popup_example_02.eps width=\textwidth
+ *
+ * @example popup_example_02.c
+ */
+
+/**
+ * @page popup_example_03_c popup_example_03.c
+ * @include popup_example_03.c
+ *
+ * This example will look like this:
+ *
+ * @image html screenshots/popup_example_03.png
+ * @image latex screenshots/popup_example_03.eps width=\textwidth
+ *
+ * @example popup_example_03.c
+ */
+
+/**
  * @page tutorial_frame Frame example
  * @dontinclude frame_example_01.c
  *
  */
 
 /**
- * @page tutorial_anchorblock_example Anchorblock/Anchorview example
- * This example will show both Anchorblock and @ref Anchorview,
- * since both are very similar and it's easier to show them once and side
- * by side, so the difference is more clear.
- *
- * We'll show the relevant snippets of the code here, but the full example
- * can be found here... sorry, @ref anchorblock_example_01.c "here".
- *
- * As for the actual example, it's just a simple window with an anchorblock
- * and an anchorview, both containing the same text. After including
- * Elementary.h and declaring some functions we'll need, we jump to our
- * elm_main (see ELM_MAIN) and create our window.
- * @dontinclude anchorblock_example_01.c
- * @skip int
- * @until const char
- * @until ;
- *
- * With the needed variables declared, we'll create the window and a box to
- * hold our widgets, but we don't need to go through that here.
- *
- * In order to make clear where the anchorblock ends and the anchorview
- * begins, they'll be each inside a @ref Frame. After creating the frame,
- * the anchorblock follows.
- * @skip elm_frame_add
- * @until elm_frame_content_set
- *
- * Nothing out of the ordinary there. What's worth mentioning is the call
- * to elm_anchorblock_hover_parent_set(). We are telling our widget that
- * when an anchor is clicked, the hover for the popup will cover the entire
- * window. This affects the area that will be obscured by the hover and
- * where clicking will dismiss it, as well as the calculations it does to
- * inform the best locations where to insert the popups content.
- * Other than that, the code is pretty standard. We also need to set our
- * callback for when an anchor is clicked, since it's our task to populate
- * the popup. There's no default for it.
- *
- * The anchorview is no different, we only change a few things so it looks
- * different.
- * @until elm_frame_content_set
- *
- * Then we run, so stuff works and close our main function in the usual way.
- * @until ELM_MAIN
- *
- * Now, a little note. Normally you would use either one of anchorblock or
- * anchorview, set your one callback to clicks and do your stuff in there.
- * In this example, however, there are a few tricks to make it easier to
- * show both widgets in one go (and to save me some typing). So we have
- * two callbacks, one per widget, that will call a common function to do
- * the rest. The trick is using ::Elm_Entry_Anchorblock_Info for the
- * anchorview too, since both are equal, and passing a callback to use
- * for our buttons to end the hover, because each widget has a different
- * function for it.
- * @until _anchorview_clicked_cb
- * @until }
- *
- * The meat of our popup is in the following function. We check what kind
- * of menu we need to show, based on the name set to the anchor in the
- * markup text. If there's no type (something went wrong, no valid contact
- * in the address list) we are just putting a button that does nothing, but
- * it's perfectly reasonable to just end the hover and call it quits.
- *
- * Our popup will consist of one main button in the middle of our hover,
- * and possibly a secondary button and a list of other options. We'll create
- * first our main button and check what kind of popup we need afterwards.
- * @skip static void
- * @skip static void
- * @until eina_stringshare_add
- * @until }
- *
- * Each button has two callbacks, one is our hack to close the hover
- * properly based on which widget it belongs to, the other a simple
- * printf that will show the action with the anchors own data. This is
- * not how you would usually do it. Instead, the common case is to have
- * one callback for the button that will know which function to call to end
- * things, but since we are doing it this way it's worth noting that
- * smart callbacks will be called in reverse in respect to the order they
- * were added, and since our @c btn_end_cb will close the hover, and thus
- * delete our buttons, the other callback wouldn't be called if we had
- * added it before.
- *
- * After our telephone popup, there are a few others that are practically
- * the same, so they won't be shown here.
- *
- * Once we are done with that, it's time to place our actions into our
- * hover. Main button goes in the middle without much questioning, and then
- * we see if we have a secondary button and a box of extra options.
- * Because I said so, secondary button goes on either side and box of
- * options either on top or below the main one, but to choose which
- * exactly, we use the hints our callback info has, which saves us from
- * having to do the math and see which side has more space available, with
- * a little special case where we delete our extra stuff if there's nowhere
- * to place it.
- * @skip url:
- * @skip }
- * @skip evas_object_smart
- * @until evas_object_del(box)
- * @until }
- * @until }
- *
- * The example will look like this:
- *
- * @image html screenshots/anchorblock_01.png
- * @image latex screenshots/anchorblock_01.eps width=\textwidth
- *
- * @example anchorblock_example_01.c
- */
-
-/**
  * @page tutorial_check Check example
  * @dontinclude check_example_01.c
  *
  * @until show(rect)
  *
  * Now that we have a window with background and a rectangle we can create
- * our color_selector and set it's initial color to fully opaque blue:
- * @until show
+ * our color_selector
+ * @until elm_colorselector_add
  *
- * Next we tell ask to be notified whenever the color changes:
+ * Now colors can be loaded to color selector's palette by setting the palette name
+ * @until show(cs)
+ *
+ * Next we ask to be notified whenever the color changes on selector:
  * @until changed
  *
- * We follow that we some more run of the mill setup code:
+ * Next we ask to be notified whenever the color item is selected and longpressed:
+ * @until color,item,longpressed
+ *
+ * We add some more code to the usual setup code:
  * @until ELM_MAIN()
  *
- * And now get to the callback that sets the color of the rectangle:
+ * now get to the "changed" callback that sets the color of the rectangle:
+ * @until }
+ *
+ * And now get to the "color,item,selected" callback that sets the color of the rectangle:
+ * @until }
+ *
+ * And now get to the "color,item,longpressed" callback that gets and displays 
+ * the color of the rectangle:
  * @until }
  *
  * This example will look like this:
  * the photocam to go in to a zoom mode that makes the image fit inside the
  * photocam. Tough this has no effect on the image we also print what region was
  * being viewed before setting the zoom mode:
+ * @skip static
  * @until }
  * @note When in fit mode our slider(explained below) won't work.
  *
  * The second button("Unfit") will bring the photocam back into manual zoom
  * mode:
+ * @skip static
  * @until }
  *
  * Our slider controls the level of zoom of the photocam:
+ * @skip static
  * @until }
  * @note It is important to note that this only works when in manual zoom mode.
  *
  * new window, so we have to handle them by setting a callback function that
  * will ultimately call this very same function to add a new tab.
  *
+ * @skip td->tab = NULL
  * @skip Tab_Data
  * @until }
  *
  * @example clock_example.c
  */
 
+ /**
+ * @page datetime_example_c Datetime example
+ * @include datetime_example.c
+ * @example datetime_example.c
+ */
+
+/**
+ * @page dayselector_example_c Dayselector example
+ * @include dayselector_example.c
+ * @example dayselector_example.c
+ */
+
 /**
  * @page flipselector_example_c Flipselector example
  * @include flipselector_example.c