[SAMPLE APP][Wearable Native]Latest Update
authornamki.lee <namki.lee@samsung.com>
Thu, 21 Jan 2016 08:30:10 +0000 (17:30 +0900)
committernamki.lee <namki.lee@samsung.com>
Thu, 21 Jan 2016 08:30:10 +0000 (17:30 +0900)
Change-Id: Id9e6d2412ba511350de55bb40297748e146a067e
Signed-off-by: namki.lee <namki.lee@samsung.com>
12 files changed:
org.tizen.sampledescriptions/html/wearable_n/alarm_widget_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/analog_watch_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/bluetooth_le_service_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/circlemusic_sd_wn.htm [new file with mode: 0644]
org.tizen.sampledescriptions/html/wearable_n/circlerotarytimer_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/digital_watch_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/new_briefing_widget_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/scheduler_widget_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/settings_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/taskmanager_sd_wn.htm
org.tizen.sampledescriptions/html/wearable_n/worldclock_widget_sd_wn.htm

index 941daab..98f0b4e 100644 (file)
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 
 <div id="toc-navigation">
-
+</div> 
 <div id="container"><div id="contents"><div class="content">
 
        <div id="profile">
                <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
        </div>
        
-</div> 
+
 
 
 <h1>Alarm Widget Sample Overview</h1> 
 
-<p>The Alarm widget sample demonstrates how to manage text objects and image objects to create a complete widget view.</p>
-<p>The following figure illustrates the main screen of the Alarm widget.</p>
-<p class="figure">Figure: Alarm main view</p>
-<p align="center"><img src="../images/alarm_wearable_sd.png" alt="Alarm main view" /></p>
+<p>The Alarm Widget sample application demonstrates how to manage text objects and image objects to create a complete widget view.</p>
+<p>The following figure illustrates the main screen of the Alarm Widget.</p>
+<p class="figure">Figure: Alarm Widget main view</p>
+<p align="center"><img src="../images/alarm_wearable_sd.png" alt="Alarm Widget main view" /></p>
+
+<p>The application displays the time and weekday when the alarm is triggered.</p> 
 
-<p>This sample consists of the view and main operation parts.</p> 
+<h2>Implementation</h2>
 
-<h2>View</h2
+<h3>View</h3
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the widget view frame that consists of the window, text parts, and image parts.</p>
 <pre class="prettyprint">
 view_create(context, w, h);
 </pre>
-<p>The following figure illustrates the view frame.</p>
-<p class="figure">Figure: Alarm view frame</p>
-<p align="center"><img src="../images/alarm_structure_wearable_sd.png" alt="Alarm view frame" /></p>
 
-<p>To fill out text parts with the part name and the text, use the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function.</p>
+<p class="figure">Figure: Alarm Widget view frame</p>
+<p align="center"><img src="../images/alarm_structure_wearable_sd.png" alt="Alarm Widget view frame" /></p>
+
+<p>To fill out the text parts:</p>
 
-<p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
+<ol><li><p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out.</p></li>
+<li><p>Call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p></li></ol>
 <p>In this example, the text to use is <span style="font-family: Courier New,Courier,monospace">time_txt</span> and the part name to fill out is <span style="font-family: Courier New,Courier,monospace">widget.time</span>.</p>
 <pre class="prettyprint">
 time_txt = data_get_text(&quot;widget.time&quot;);
 view_set_text(wid, &quot;widget.time&quot;, time_txt);
 </pre>
 
-<h2>Main Operation</h2>
+<h3>Main Operation</h3>
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_set_event_callback()</span> function controls the widget main operation that launches the application.</p>
 <p>The launch options are:</p>
 <ul>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_PRESSED</span> for launch on a touch press event</li>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_RELEASED</span> for launch on a touch release event </li>
-<li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span>for launch on a click event</li>
+<li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span> for launch on a click event</li>
 </ul>
-<p>In this example, the application is launched when you click the widget.</p>
+<p>In this example, the application is launched when you click the widget:</p>
 <pre class="prettyprint">
 view_set_event_callback(wid, &quot;widget.event&quot;, WIDGET_EVENT_CLICKED, clicked_cb);
 </pre>
index 6d3d497..42bdcf3 100644 (file)
@@ -139,13 +139,13 @@ _clock_set_info_time(void *data, watch_time_h watch_time)
 &nbsp;&nbsp;&nbsp;h = ad-&gt;h;
 
 &nbsp;&nbsp;&nbsp;num = _get_radian((hour24%12) * HOUR_ANGLE);
-&nbsp;&nbsp;&nbsp;_D(&quot;Hour : %d&quot;, hour24%12);
+&nbsp;&nbsp;&nbsp;_D(&quot;Hour: %d&quot;, hour24%12);
 &nbsp;&nbsp;&nbsp;evas_object_line_xy_set(ad-&gt;hour_needle, (w/2), (h/2), 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(w/2) + HOUR_NEEDLE_SIZE*(sin(num)), 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(h/2) - HOUR_NEEDLE_SIZE*(cos(num)));
 
 &nbsp;&nbsp;&nbsp;num = _get_radian(minute * MIN_ANGLE);
-&nbsp;&nbsp;&nbsp;_D(&quot;Min : %d&quot;, minute);
+&nbsp;&nbsp;&nbsp;_D(&quot;Min: %d&quot;, minute);
 &nbsp;&nbsp;&nbsp;evas_object_line_xy_set(ad-&gt;min_needle, (w/2), (h/2), 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(w/2) + MIN_NEEDLE_SIZE*(sin(num)), 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(h/2) - MIN_NEEDLE_SIZE*(cos(num)));
index 7792544..817b5c6 100644 (file)
 <h1>Bluetooth LE Service Sample Overview</h1>
 
 <p>
-The Bluetooth LE Service sample application demonstrates how to implement a service that continuously broadcasts data using the Bluetooth Low Energy adapter. In order to achive the goal, the
-<a href="https://developer.tizen.org/dev-guide/2.4.0/org.tizen.native.mobile.apireference/group__CAPI__NETWORK__BLUETOOTH__ADAPTER__LE__MODULE.html">Bluetooth LE Adapter</a>
-API is used. The continuous data broadcast using the mentioned method is called advertising. The service advertises small packets of data to identify a device within the Bluetooth network.
-Once the advertisment is received by any other device, one can query the advertiser for detailed service data. The query process is called scanning. In a scan response the service data, identified by preassigned UUID,
-is returned.
-</p>
+The Bluetooth LE Service sample application demonstrates how to implement a service that continuously broadcasts data using the Bluetooth Low Energy (LE) adapter and the <a href="../../../org.tizen.native.wearable.apireference/group__CAPI__NETWORK__BLUETOOTH__ADAPTER__LE__MODULE.html">Bluetooth LE Adapter</a> API.</p>
 
-<p>
-The general idea behind this sample application is to share the health information gathered from the Heart Rate sensor which is built into the wearable device. There are two types of advertized information:
+<p>This kind of continuous data broadcast is called advertising. The service advertises small packets of data to identify a device within the Bluetooth network. Once the advertisement is received by any other device, they can query the advertiser for detailed service data. The query process is called scanning. The scan response returns the service data, identified by a preassigned UUID.</p>
+
+<p>The purpose of this sample application is to share health information gathered from the heart rate sensor built into the wearable device. There are 2 types of advertised information:</p>
        <ul>
-               <li>Heart Rate Measurement - the number of heart beats per second (acquired directly from the Heart Rate sensor). This data is identified by the UUID = 0x2A37;</li>
-               <li>Body Sensor Location - the point of measurement which is fixed for the entire lifecycle of the service. This data is identified by the UUID = 0x2A38.</li>
+               <li>Heart rate measurement
+<p>The number of heart beats per second, which is acquired directly from the heart rate sensor. This data is identified by <span style="font-family: Courier New,Courier,monospace">UUID = 0x2A37</span>.</p></li>
+               <li>Body sensor location
+<p>The point of the measurement, which is fixed for the entire life-cycle of the service. This data is identified by <span style="font-family: Courier New,Courier,monospace">UUID = 0x2A38</span>.</p></li>
        </ul>
-</p>
+
 
 <h2>Prerequisites</h2>
 
-<p>To ensure proper service execution, the following privileges must be set:</p>
+<p>To ensure proper application  execution, the following privileges must be set:</p>
        <ul>
-               <li><span style="font-family: Courier New,Courier,monospace">http://tizen.org/privilege/bluetooth,</span></li>
-               <li><span style="font-family: Courier New,Courier,monospace">http://tizen.org/privilege/healthinfo.</span></li>
+               <li><span style="font-family: Courier New,Courier,monospace">http://tizen.org/privilege/bluetooth</span></li>
+               <li><span style="font-family: Courier New,Courier,monospace">http://tizen.org/privilege/healthinfo</span></li>
        </ul>
-</p>
 
 <h2>Implementation</h2>
 
-<h3>Service initialization and termination</h3>
+<p>For the details of undescribed function within the following sections, see <a href="#ref">References</a>.</p>
 
-<h4>Initialization</h4>
+<h3>Service Initialization and Termination</h3>
 
-<p>
-Before the service starts its operation, the availability of relevant Bluetooth interfaces is checked by calling the following functions:
+<p>The service application must be properly initialized and terminated:</p>
+
+<ul>
+<li>Initialization
+<p>Before the service starts its operation, the availability of relevant Bluetooth interfaces is checked by calling the following functions:</p>
        <ul>
-               <li><span style="font-family: Courier New,Courier,monospace">bt_common_is_bluetooth_supported()</span> - General Bluetooth adapter;</li>
-               <li><span style="font-family: Courier New,Courier,monospace">bt_common_is_bluetooth_le_supported()</span> - Low Energy Bluetooth adapter.</li>
+               <li><span style="font-family: Courier New,Courier,monospace">bt_common_is_bluetooth_supported()</span> (general Bluetooth adapter)</li>
+               <li><span style="font-family: Courier New,Courier,monospace">bt_common_is_bluetooth_le_supported()</span> (LE Bluetooth adapter)</li>
        </ul>
-If both of them are available, the Heart Rate sensor listener is created with <span style="font-family: Courier New,Courier,monospace">sensor_listener_create()</span> function. Finally, the Bluetooth
-interface is initialized with the <span style="font-family: Courier New,Courier,monospace">__bt_init()</span> function.
-</p>
+<p>If both adapters are available, the heart rate sensor listener is created with the <span style="font-family: Courier New,Courier,monospace">sensor_listener_create()</span> function. Finally, the Bluetooth interface is initialized with the <span style="font-family: Courier New,Courier,monospace">__bt_init()</span> function.</p>
+
 
 <pre class="prettyprint">
-static bool __bt_init(void)
+static bool 
+__bt_init(void)
 {
 &nbsp;&nbsp;&nbsp;bool is_enabled = false;
 
-&nbsp;&nbsp;&nbsp;/* Access to the H/W Bluetooth adapter is initialized. */
-&nbsp;&nbsp;&nbsp;if (bt_common_init()) {
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/* The __bt_device_state_changed_cb() callback function is registered to be invoked on Bluetooth adapter state change. */
+&nbsp;&nbsp;&nbsp;// Initialize access to the hardware Bluetooth adapter
+&nbsp;&nbsp;&nbsp;if (bt_common_init()) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Register __bt_device_state_changed_cb() callback for Bluetooth adapter state changes
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_common_set_state_change_callback(__bt_device_state_changed_cb);
 
-&nbsp;&nbsp;&nbsp;/* The current state of the Bluetooth adapter is obtained.
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;If it is enabled the the __bt_device_state_changed_cb() callback function is artificially invoked. */
-&nbsp;&nbsp;&nbsp;bt_common_get_state(&is_enabled);
-&nbsp;&nbsp;&nbsp;if (is_enabled)
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__bt_device_state_changed_cb(BT_ERROR_NONE, BT_ADAPTER_ENABLED, NULL);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Obtain the current state of the Bluetooth adapter
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// If it is enabled, the __bt_device_state_changed_cb() callback is artificially invoked
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_common_get_state(&amp;is_enabled);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (is_enabled)
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__bt_device_state_changed_cb(BT_ERROR_NONE, BT_ADAPTER_ENABLED, NULL);
 &nbsp;&nbsp;&nbsp;}
 
 &nbsp;&nbsp;&nbsp;return is_enabled;
 }
-</pre>
+</pre></li>
 
-<p>
-See the <a href="#ref">References</a> section for details of all undescribed functions.
-</p>
-
-<h4>Termination</h4>
+<li>Termination
 
-<p>
-In the service termination procedure, the Heart Rate sensor listener and data advertizer are destroyed, the assigned callback function is unset and, finally, the access to the Bluetooth adapter is deinitialized.
-</p>
+<p>In the service termination procedure, the heart rate sensor listener and data advertiser are destroyed, the assigned callback function is unset and, finally, the access to the Bluetooth adapter is deinitialized.</p>
 
 <pre class="prettyprint">
-void controller_terminate(void)
+void 
+controller_terminate(void)
 {
 &nbsp;&nbsp;&nbsp;sensor_listener_delete();
 
-&nbsp;&nbsp;&nbsp;bt_advertiser_delete(&__ctrldata.adv_hrm_h);
-&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, "Heart Rate Measurement advertiser stopped.");
+&nbsp;&nbsp;&nbsp;bt_advertiser_delete(&amp;__ctrldata.adv_hrm_h);
+&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, &quot;Heart Rate Measurement advertiser stopped.&quot;);
 
 &nbsp;&nbsp;&nbsp;bt_common_unset_state_change_callback();
 &nbsp;&nbsp;&nbsp;bt_common_deinit();
 }
 </pre>
+</li></ul>
 
-<p>
-See the <a href="#ref">References</a> section for details of all undescribed functions.
-</p>
+<h3 id="adv-creation">Creating the Advertiser</h3>
 
-<h3 id="adv-creation">Advertiser creation</h3>
+<p>To create the advertiser:</p>
 
-<p>
-Once the Bluetooth adapter state is changed to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_ENABLED</span> and the
-<span style="font-family: Courier New,Courier,monospace">__bt_device_state_changed_cb()</span> callback function is invoked, the advertiser creation procedure takes place.
-<br>
-In case the <span style="font-family: Courier New,Courier,monospace">__bt_device_state_changed_cb()</span> callback function is invoked with the
-<span style="font-family: Courier New,Courier,monospace">adapter_state</span> argument set to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_DISABLED</span>,
-the currently running advertiser is deleted (<span style="font-family: Courier New,Courier,monospace">bt_advertiser_delete()</span>).
-</p>
+<ol>
+<li>
+<p>When the Bluetooth adapter state changes to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_ENABLED</span> and the <span style="font-family: Courier New,Courier,monospace">__bt_device_state_changed_cb()</span> callback is invoked, the advertiser is created.</p>
+
+<p>In case the <span style="font-family: Courier New,Courier,monospace">__bt_device_state_changed_cb()</span> callback is invoked with the <span style="font-family: Courier New,Courier,monospace">adapter_state</span> parameter set to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_DISABLED</span>, the currently running advertiser is deleted (<span style="font-family: Courier New,Courier,monospace">bt_advertiser_delete()</span>).</p>
 
 <pre class="prettyprint">
-static void __bt_device_state_changed_cb(int result, bt_adapter_state_e adapter_state, void *user_data)
+static void 
+__bt_device_state_changed_cb(int result, bt_adapter_state_e adapter_state, void *user_data)
 {
-&nbsp;&nbsp;&nbsp;if (adapter_state == BT_ADAPTER_ENABLED) {
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (bt_advertiser_create(&__ctrldata.adv_hrm_h, APPEARANCE_GENERIC_HEART_RATE_SENSOR)) {
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_INFO, LOG_TAG, "Heart Rate Measurement advertiser started.");
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} else {
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, "Failed to start Heart Rate Measurement advertiser.");
+&nbsp;&nbsp;&nbsp;if (adapter_state == BT_ADAPTER_ENABLED) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (bt_advertiser_create(&amp;__ctrldata.adv_hrm_h, APPEARANCE_GENERIC_HEART_RATE_SENSOR)) 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_INFO, LOG_TAG, &quot;Heart Rate Measurement advertiser started.&quot;);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;else 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, &quot;Failed to start Heart Rate Measurement advertiser.&quot;);
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
-&nbsp;&nbsp;&nbsp;} else {
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertiser_delete(&__ctrldata.adv_hrm_h);
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, "Heart Rate Measurement advertiser stopped.");
+&nbsp;&nbsp;&nbsp;} 
+&nbsp;&nbsp;&nbsp;else 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertiser_delete(&amp;__ctrldata.adv_hrm_h);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_WARN, LOG_TAG, &quot;Heart Rate Measurement advertiser stopped.&quot;);
 &nbsp;&nbsp;&nbsp;}
 }
 </pre>
+</li>
 
-<p>
-The <span style="font-family: Courier New,Courier,monospace">bt_advertiser_create()</span> function creates the advertiser handle, performs its initial configuration and starts advertising.
-</p>
+<li>
+<p>The <span style="font-family: Courier New,Courier,monospace">bt_advertiser_create()</span> function creates the advertiser handle, performs its initial configuration, and starts advertising.</p>
+<p>The creation of the advertiser handle and the initial configuration is performed by the <span style="font-family: Courier New,Courier,monospace">__create_advertizer()</span> function. Once the function succeeds, the advertising starts (<span style="font-family: Courier New,Courier,monospace">bt_common_start_advertising()</span>).</p>
 
 <pre class="prettyprint">
-bool bt_advertiser_create(bt_advertiser_h *adv_h, int appearance)
+bool 
+bt_advertiser_create(bt_advertiser_h *adv_h, int appearance)
 {
 &nbsp;&nbsp;&nbsp;if (!__create_advertizer(adv_h, appearance))
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 
-&nbsp;&nbsp;&nbsp;if (!bt_common_start_advertising(*adv_h, NULL)) {
+&nbsp;&nbsp;&nbsp;if (!bt_common_start_advertising(*adv_h, NULL)) 
+&nbsp;&nbsp;&nbsp;{
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__delete_advertizer(adv_h);
+
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 &nbsp;&nbsp;&nbsp;}
 
@@ -162,14 +165,25 @@ bool bt_advertiser_create(bt_advertiser_h *adv_h, int appearance)
 &nbsp;&nbsp;&nbsp;return true;
 }
 </pre>
+</li>
 
-<p>
-The advertiser's handle's creation and initial configuration is performed by the <span style="font-family: Courier New,Courier,monospace">__create_advertizer()</span> function listed below.
-Once the function succeeds, the advertising starts (<span style="font-family: Courier New,Courier,monospace">bt_common_start_advertising()</span>).
-</p>
+<li>
+<p>Within the <span style="font-family: Courier New,Courier,monospace">__create_advertizer()</span> function:</p>
+       <ul>
+               <li>The advertiser handle is created with the <span style="font-family: Courier New,Courier,monospace">bt_common_create_advertizer()</span> function.</li>
+               <li>The advertiser mode is set to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_ADVERTISING_MODE_LOW_LATENCY</span>, which sets the lowest possible interval between subsequent packet sending with the cost of higher energy consumption (<span style="font-family: Courier New,Courier,monospace">bt_common_set_advertising_mode()</span>).</li>
+               <li>The advertiser remains connectable by other peers (<span style="font-family: Courier New,Courier,monospace">bt_common_set_connectable()</span>).</li>
+               <li>The advertiser properties are defined and set:
+                       <ul>
+                               <li>For the advertising mode (<span style="font-family: Courier New,Courier,monospace">__set_advertizing_properties()</span>)</li>
+                               <li>For the scan response mode (<span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span>)</li>
+                       </ul>
+               </li>
+       </ul>
 
 <pre class="prettyprint">
-static bool __create_advertizer(bt_advertiser_h *adv_h, int appearance)
+static bool 
+__create_advertizer(bt_advertiser_h *adv_h, int appearance)
 {
 &nbsp;&nbsp;&nbsp;*adv_h = NULL;
 
@@ -191,104 +205,79 @@ static bool __create_advertizer(bt_advertiser_h *adv_h, int appearance)
 &nbsp;&nbsp;&nbsp;return true;
 }
 </pre>
-
-<p>
-Within the <span style="font-family: Courier New,Courier,monospace">__create_advertizer()</span> function:
+</li>
+<li>
+<p>The advertiser properties determine the amount and category of information to be broadcast over the Bluetooth LE adapter. It is assumed that:</p>
        <ul>
-               <li>the advertiser's handle is created with <span style="font-family: Courier New,Courier,monospace">bt_common_create_advertizer()</span> function;</li>
-               <li>the advertiser mode is set to <span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_ADVERTISING_MODE_LOW_LATENCY</span> which sets the lowest possible
-               interval between subsequent packets sending with the cost of higher energy consumption (<span style="font-family: Courier New,Courier,monospace">bt_common_set_advertising_mode()</span>);</li>
-               <li>the advertiser remains connectable by other peers (<span style="font-family: Courier New,Courier,monospace">bt_common_set_connectable()</span>);</li>
-               <li>the advertiser's properties are defined and set:
+               <li>An advertising packet (<span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_PACKET_ADVERTISING</span>) is a carrier of the following information:
                        <ul>
-                               <li>for advertising mode (<span style="font-family: Courier New,Courier,monospace">__set_advertizing_properties()</span>);</li>
-                               <li>for scan response mode (<span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span>).</li>
+                               <li>Device name (obtained automatically by the internal implementation of the Bluetooth LE Adapter module)</li>
+                               <li>Manufacturer identifier: <span style="font-family: Courier New,Courier,monospace">0x0075</span> (complies with the <a href="https://www.bluetooth.com/specifications/assigned-numbers/Company-Identifiers" target="_blank">company identifiers</a> assigned by the Bluetooth SIG, Inc., so that the assigned value identifies the Samsung Electronics Co. Ltd. company)</li>
                        </ul>
+               <p>The role of this packet type is to introduce the device (advertise its existence) within the Bluetooth LE network. The devices that receive such a packet can send a scan request to query the detailed data carried by the device.</p>
                </li>
-       </ul>
-The advertiser's properties setting determines the amount and the category of information to be broadcasted over the Bluetooth LE adapter. It is assumed that:
-       <ul>
-               <li>
-               an advertising packet (<span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_PACKET_ADVERTISING</span>) is a carrier of the following information:
+               <li>A scan response packet (<span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_PACKET_SCAN_RESPONSE</span>) is a carrier of the following information:
                        <ul>
-                               <li>device's name (obtained automatically by the internal implementation of the Bluetooth LE Adapter module);</li>
-                               <li>manufacturer's identifier: 0x0075 (complies with the <a href="https://www.bluetooth.com/specifications/assigned-numbers/Company-Identifiers">company identifiers</a>
-                               assigned by the Bluetooth SIG, Inc.). The assigned value identifies Samsung Electronics Co. Ltd. company.</li>
+                               <li>Device name (obtained automatically by the internal implementation of the Bluetooth LE Adapter module)</li>
+                               <li>Appearance: <span style="font-family: Courier New,Courier,monospace">832</span> (complies with the
+                               <a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.gap.appearance.xml" target="_blank">external device appearance</a> assigned by the Bluetooth SIG, Inc., so that the assigned value identifies the device as a generic heart rate sensor)</li>
+                               <li>Manufacturer identifier (same as in the advertising packet)</li>
                        </ul>
-               The role of this type of packet is to introduce the device (advertise its existence) within the Bluetooth LE network. The one who receives such a packet can send a scan request to query detailed data
-               carried by the device.
-               </li>
-               <li>
-               a scan response packet (<span style="font-family: Courier New,Courier,monospace">BT_ADAPTER_LE_PACKET_SCAN_RESPONSE</span>) is a carrier of the following information:
-                       <ul>
-                               <li>device's name (obtained automatically by the internal implementation of the Bluetooth LE Adapter module);</li>
-                               <li>appearance: 832 (complies with the
-                               <a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.gap.appearance.xml">external device's appearance</a>
-                               assigned by the Bluetooth SIG, Inc.). The assigned value identifies the device as a Generic Heart Rate Sensor.</li>
-                               <li>manufacturer's identifier (see the itemization above for details).</li>
-                       </ul>
-               The role of this type of packet is to provide detailed data acquired during the service lifecycle (heart rate measuremet and body sensor location values). This packet is sent in response to a scan request.
+               <p>The role of this packet type is to provide detailed data acquired during the service life-cycle (heart rate measurement and body sensor location values). This packet is sent in response to a scan request.</p>
                </li>
        </ul>
-The <span style="font-family: Courier New,Courier,monospace">__set_advertizing_properties()</span> and the
-<span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span> functions are only convenient wrappers and call the
-<span style="font-family: Courier New,Courier,monospace">__set_properties()</span> function with appropriately adjusted arguments. For reference of properties' setting, see the code listing below.
-</p>
+<p>The <span style="font-family: Courier New,Courier,monospace">__set_advertizing_properties()</span> and the <span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span> functions are only convenient wrappers and call the <span style="font-family: Courier New,Courier,monospace">__set_properties()</span> function with appropriately adjusted parameters.</p>
 
 <pre class="prettyprint">
-static bool __set_properties(bt_advertiser_h adv_h, struct _adv_properties properties)
+static bool 
+__set_properties(bt_advertiser_h adv_h, struct _adv_properties properties)
 {
-&nbsp;&nbsp;&nbsp;/* Sets whether the device's name is to be included in the packet. */
+&nbsp;&nbsp;&nbsp;// Set whether the device name is to be included in the packet
 &nbsp;&nbsp;&nbsp;if (!bt_common_set_device_name(adv_h, properties.pkt_type, properties.name))
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 
-&nbsp;&nbsp;&nbsp;/* Sets the device's appearance value if provided. */
-&nbsp;&nbsp;&nbsp;if (properties.appearance > 0)
+&nbsp;&nbsp;&nbsp;// Set the device appearance value, if provided
+&nbsp;&nbsp;&nbsp;if (properties.appearance &gt; 0)
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (!bt_common_set_appearance(adv_h, properties.pkt_type, properties.appearance))
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 
-&nbsp;&nbsp;&nbsp;/* Sets the device's manufacturer identifier if provided. */
-&nbsp;&nbsp;&nbsp;if (properties.manufacturer_id > 0)
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (!bt_common_set_manufacturer(adv_h,
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;properties.pkt_type,
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;properties.manufacturer_id,
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(const char *)&properties.manufacturer_data,
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;sizeof(struct _manufacturer_data)))
+&nbsp;&nbsp;&nbsp;// Set the device manufacturer identifier, if provided
+&nbsp;&nbsp;&nbsp;if (properties.manufacturer_id &gt; 0)
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (!bt_common_set_manufacturer(adv_h, properties.pkt_type, properties.manufacturer_id,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(const char *)&amp;properties.manufacturer_data,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;sizeof(struct _manufacturer_data)))
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 
-&nbsp;&nbsp;&nbsp;/* Sets whether the transmition power level is to be included in the packet. */
+&nbsp;&nbsp;&nbsp;// Set whether the transmission power level is to be included in the packet
 &nbsp;&nbsp;&nbsp;if (!bt_common_set_tx_power_level(adv_h, properties.pkt_type, properties.tx_power))
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return false;
 
 &nbsp;&nbsp;&nbsp;return true;
 }
-</pre>
+</pre></li>
+</ol>
 
-<p>
-See the <a href="#ref">References</a> section for details of all undescribed functions.
-</p>
+<h3 id="data-adv">Advertising Data</h3>
 
-<h3 id="data-adv">Data advertising</h3>
+<p>Each time data is received from the heart rate sensor, the <span style="font-family: Courier New,Courier,monospace">__sensor_data_read_cb()</span> callback is invoked. Within the callback, the heart rate measurement value is packed into the advertiser buffer and broadcast over the Bluetooth network with the relevant UUID value. Together with the obtained measurement, the body sensor location data package is created and handled similarly.</p>
 
-<p>
-Each time data is received from the Heart Rate sensor, the <span style="font-family: Courier New,Courier,monospace">__sensor_data_read_cb()</span> callback function is invoked.
-Within this function, the Heart Rate measurement value is packed into the advertiser buffer and broadcasted over the Bluetooth network with the relevant UUID value. Together with the obtained measurement,
-the body sensor location data package is created and handled similarly.
-<br>
-The structure of both types of data is implemented according to HDP (Health Device Profile) Bluetooth standard. For details, see the official characteristics defined by the
-Bluetooth SIG, Inc.:
+<p>The structure of both data types is implemented according to the HDP (Health Device Profile) Bluetooth standard. For details, see the official characteristics defined by the Bluetooth SIG, Inc.:</p>
        <ul>
-               <li><a href="https://developer.bluetooth.org/gatt/services/Pages/ServiceViewer.aspx?u=org.bluetooth.service.heart_rate.xml">Heart Rate</a> service specification.
-               According to the standard, the Heart Rate Control Point is omitted as the Energy Expanded flag is set to disabled state in the Heart Rate Measurement service;</li>
-               <li><a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.heart_rate_measurement.xml">Heart Rate
-               Measurement</a> service specification;</li>
-               <li><a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.body_sensor_location.xml">Body Sensor
-               Location</a> service specification.</li>
+               <li><a href="https://developer.bluetooth.org/gatt/services/Pages/ServiceViewer.aspx?u=org.bluetooth.service.heart_rate.xml" target="_blank">Heart Rate</a> service specification.
+               <p>According to the standard, the Heart Rate Control Point is omitted as the Energy Expanded flag is set to the disabled state in the Heart Rate Measurement service.</p></li>
+               <li><a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.heart_rate_measurement.xml" target="_blank">Heart Rate Measurement</a> service specification</li>
+               <li><a href="https://developer.bluetooth.org/gatt/characteristics/Pages/CharacteristicViewer.aspx?u=org.bluetooth.characteristic.body_sensor_location.xml" target="_blank">Body Sensor Location</a> service specification</li>
        </ul>
-</p>
 
+<p>The data is packed into the buffers using the following functions:</p>
+       <ul>
+               <li><span style="font-family: Courier New,Courier,monospace">__pack_heart_rate_measurement_data()</span> handles the heart rate measurement value obtained from the heart rate sensor.</li>
+               <li><span style="font-family: Courier New,Courier,monospace">__pack_body_sensor_location_data()</span> handles the body sensor location defined as a constant value respective to the device the software runs on.</li>
+       </ul>   
+       
 <pre class="prettyprint">
-static void __sensor_data_read_cb(float *data, int data_count)
+static void 
+__sensor_data_read_cb(float *data, int data_count)
 {
 &nbsp;&nbsp;&nbsp;int buffer_size = 0;
 &nbsp;&nbsp;&nbsp;char *buffer = NULL;
@@ -297,46 +286,45 @@ static void __sensor_data_read_cb(float *data, int data_count)
 &nbsp;&nbsp;&nbsp;if (!__ctrldata.adv_hrm_h)
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
 
-&nbsp;&nbsp;&nbsp;if (__pack_heart_rate_measurement_data(data[HEART_RATE_SENSOR_DATA_INDEX], &buffer, &buffer_size)) {
+&nbsp;&nbsp;&nbsp;if (__pack_heart_rate_measurement_data(data[HEART_RATE_SENSOR_DATA_INDEX], &amp;buffer, &amp;buffer_size)) 
+&nbsp;&nbsp;&nbsp;{
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;uuid = heart_rate_measurement_model_get_uuid();
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertizer_set_data(&__ctrldata.adv_hrm_h, uuid, (const char *)buffer, buffer_size);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertizer_set_data(&amp;__ctrldata.adv_hrm_h, uuid, (const char *)buffer, buffer_size);
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;free(buffer);
 &nbsp;&nbsp;&nbsp;}
 
-&nbsp;&nbsp;&nbsp;if (__pack_body_sensor_location_data(&buffer, &buffer_size)) {
+&nbsp;&nbsp;&nbsp;if (__pack_body_sensor_location_data(&amp;buffer, &amp;buffer_size)) 
+&nbsp;&nbsp;&nbsp;{
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;uuid = body_sensor_location_model_get_uuid();
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertizer_set_data(&__ctrldata.adv_hrm_h, uuid, (const char *)buffer, buffer_size);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_advertizer_set_data(&amp;__ctrldata.adv_hrm_h, uuid, (const char *)buffer, buffer_size);
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;free(buffer);
 &nbsp;&nbsp;&nbsp;}
 }
 </pre>
 
-<p>
-The data is packed into the buffers using the following functions:
-       <ul>
-               <li><span style="font-family: Courier New,Courier,monospace">__pack_heart_rate_measurement_data()</span> - handles Heart Rate Measurement value obtained from the Heart Rate sensor;</li>
-               <li><span style="font-family: Courier New,Courier,monospace">__pack_body_sensor_location_data()</span> - handles Body Sensor Location defined as a constant value respective to the
-               device the software runs on.</li>
-       </ul>
-Once the data is packed into the internal buffer according to the adopted standard, it is added to the advertiser (together with the relevant UUID value) using the
-<span style="font-family: Courier New,Courier,monospace">bt_advertizer_set_data()</span> function.
-<br>
-From now on, the data is advertised over the Bluetooth network as long as it is altered in subsequent calls of the <span style="font-family: Courier New,Courier,monospace">__sensor_data_read_cb()</span>
-callback function.
-<br>
-The procedure of adding data to the advertiser is shown below.
-</p>
+<p>Once the data is packed into the internal buffer according to the adopted standard, it is added to the advertiser (together with the relevant UUID value) using the <span style="font-family: Courier New,Courier,monospace">bt_advertizer_set_data()</span> function.</p>
+<p>From now on, the data is advertised over the Bluetooth network as long as it is altered in subsequent calls of the <span style="font-family: Courier New,Courier,monospace">__sensor_data_read_cb()</span> callback.</p>
+<p>To add data to the advertiser:</p>
+
+<ol>
+<li>Stop the advertiser (<span style="font-family: Courier New,Courier,monospace">bt_common_stop_advertising()</span>) and clear the internal data buffers responsible for responding to scan requests (<span style="font-family: Courier New,Courier,monospace">bt_common_clear_advertizer()</span>).</li>
+<li>Configure the initial properties of the advertiser scan response buffer again (<span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span>) to make it ready to accept new data which is provided to the requester in a scan response message.</li>
+<li>The <span style="font-family: Courier New,Courier,monospace">bt_common_add_service_solicitation_uuid()</span> function creates a new service buffer for the relevant data (identified by the provided UUID) added with the <span style="font-family: Courier New,Courier,monospace">bt_common_set_service_data()</span> function.</li>
+<li>Start the advertiser (<span style="font-family: Courier New,Courier,monospace">bt_common_start_advertising()</span>).</li>
+</ol>
 
 <pre class="prettyprint">
-bool bt_advertizer_set_data(bt_advertiser_h *adv_h, const char *uuid, const char *data, int data_size)
+bool 
+bt_advertizer_set_data(bt_advertiser_h *adv_h, const char *uuid, const char *data, int data_size)
 {
 &nbsp;&nbsp;&nbsp;bt_common_stop_advertising(*adv_h);
 
-&nbsp;&nbsp;&nbsp;if (bt_common_clear_advertizer(*adv_h, BT_ADAPTER_LE_PACKET_SCAN_RESPONSE)) {
+&nbsp;&nbsp;&nbsp;if (bt_common_clear_advertizer(*adv_h, BT_ADAPTER_LE_PACKET_SCAN_RESPONSE)) 
+&nbsp;&nbsp;&nbsp;{
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__set_scan_response_properties(*adv_h, __advertizer_appearance);
 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (bt_common_add_service_solicitation_uuid(*adv_h, BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, uuid))
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (data_size > 0)
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (data_size &gt; 0)
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;bt_common_set_service_data(*adv_h, BT_ADAPTER_LE_PACKET_SCAN_RESPONSE, uuid, data, data_size);
 &nbsp;&nbsp;&nbsp;}
 
@@ -346,61 +334,39 @@ bool bt_advertizer_set_data(bt_advertiser_h *adv_h, const char *uuid, const char
 }
 </pre>
 
-<p>
-In order to add new data to the advertiser, it must first be stopped (<span style="font-family: Courier New,Courier,monospace">bt_common_stop_advertising()</span>) and internal data buffers responsible for
-responding to scan requests have to be cleared (<span style="font-family: Courier New,Courier,monospace">bt_common_clear_advertizer()</span>). The initial properties of the advertiser's scan response buffer
-must be configured again (<span style="font-family: Courier New,Courier,monospace">__set_scan_response_properties()</span>). Now it is ready to accept new data which will be provided to the requester
-in a scan response message. The <span style="font-family: Courier New,Courier,monospace">bt_common_add_service_solicitation_uuid()</span> function creates a new service buffer for the relevant data
-(identified by the provided UUID) added with the <span style="font-family: Courier New,Courier,monospace">bt_common_set_service_data()</span> function. At the end, the advertiser is started
-(<span style="font-family: Courier New,Courier,monospace">bt_common_start_advertising()</span>).
-</p>
-
-<p>
-See the <a href="#ref">References</a> section for details of all undescribed functions.
-</p>
-
 <h3 id="ref">References</h3>
 
-<p>
-For developer's convenience, the controller module contains a set of functions wrapping
-<a href="https://developer.tizen.org/dev-guide/2.4.0/org.tizen.native.mobile.apireference/group__CAPI__NETWORK__BLUETOOTH__ADAPTER__LE__MODULE.html">Bluetooth LE Adapter</a>
-(<span style="font-family: Courier New,Courier,monospace">bt_common.c</span> source file) and <a href="https://developer.tizen.org/dev-guide/2.4.0/org.tizen.native.mobile.apireference/group__CAPI__SYSTEM__SENSOR__MODULE.html">Sensor API</a>
-(<span style="font-family: Courier New,Courier,monospace">sensor_listener.c</span> source file).
-These functions are not listed in this document due to their simplicity.
-</p>
+<p>For your convenience, the controller module contains a set of functions wrapping the Bluetooth LE Adapter API (<span style="font-family: Courier New,Courier,monospace">bt_common.c</span> source file) and the <a href="../../../org.tizen.native.wearable.apireference/group__CAPI__SYSTEM__SENSOR__MODULE.html">Sensor API</a> (<span style="font-family: Courier New,Courier,monospace">sensor_listener.c</span> source file). These functions are not listed in this topic due to their simplicity.</p>
 
-<p>
-The <span style="font-family: Courier New,Courier,monospace">__pack_heart_rate_measurement_data()</span> and
-<span style="font-family: Courier New,Courier,monospace">__pack_body_sensor_location_data()</span> functions are not listed here as they simply encode the provided values according to
-adopted Bluetooth SIG standards.
-</p>
+<p>The <span style="font-family: Courier New,Courier,monospace">__pack_heart_rate_measurement_data()</span> and <span style="font-family: Courier New,Courier,monospace">__pack_body_sensor_location_data()</span> functions are not listed here as they simply encode the provided values according to the adopted Bluetooth SIG standards.</p>
+
+<p>The following functions are used in the above sections:</p>
 
 <pre class="prettyprint">
-void bt_advertiser_delete(bt_advertiser_h *adv_h)
+void 
+bt_advertiser_delete(bt_advertiser_h *adv_h)
 {
-&nbsp;&nbsp;&nbsp;/* Stops advertising and responding to scan requests. *.
+&nbsp;&nbsp;&nbsp;// Stops advertising and responding to scan requests
 &nbsp;&nbsp;&nbsp;bt_common_stop_advertising(*adv_h);
 &nbsp;&nbsp;&nbsp;__delete_advertizer(adv_h);
 }
-</pre>
 
-<pre class="prettyprint">
-static void __delete_advertizer(bt_advertiser_h *adv_h)
+static void 
+__delete_advertizer(bt_advertiser_h *adv_h)
 {
-&nbsp;&nbsp;&nbsp;/* Deletes the advertiser's handle. */
+&nbsp;&nbsp;&nbsp;// Delete the advertiser handle
 &nbsp;&nbsp;&nbsp;bt_common_delete_advertizer(*adv_h);
-&nbsp;&nbsp;&nbsp;/* Variables clearing. */
+&nbsp;&nbsp;&nbsp;// Clear variables
 &nbsp;&nbsp;&nbsp;*adv_h = NULL;
 &nbsp;&nbsp;&nbsp;__advertizer_appearance = 0;
 }
-</pre>
 
-<pre class="prettyprint">
-bool __set_advertizing_properties(bt_advertiser_h adv_h)
+bool 
+__set_advertizing_properties(bt_advertiser_h adv_h)
 {
 &nbsp;&nbsp;&nbsp;struct _adv_properties properties = {0,};
 
-&nbsp;&nbsp;&nbsp;/* Advertising message configuration. */
+&nbsp;&nbsp;&nbsp;// Advertising message configuration
 &nbsp;&nbsp;&nbsp;properties.pkt_type = BT_ADAPTER_LE_PACKET_ADVERTISING;
 &nbsp;&nbsp;&nbsp;properties.name = true;
 &nbsp;&nbsp;&nbsp;properties.tx_power = false;
@@ -408,17 +374,16 @@ bool __set_advertizing_properties(bt_advertiser_h adv_h)
 &nbsp;&nbsp;&nbsp;properties.manufacturer_id = MANUFACTURER_ID_SAMSUNG;
 &nbsp;&nbsp;&nbsp;properties.manufacturer_data.id = MANUFACTURER_ID_SAMSUNG;
 
-&nbsp;&nbsp;&nbsp;/* The configuration is applied to the advertiser. */
+&nbsp;&nbsp;&nbsp;// Configuration is applied to the advertiser
 &nbsp;&nbsp;&nbsp;return __set_properties(adv_h, properties);
 }
-</pre>
 
-<pre class="prettyprint">
-bool __set_scan_response_properties(bt_advertiser_h adv_h, int appearance)
+bool 
+__set_scan_response_properties(bt_advertiser_h adv_h, int appearance)
 {
 &nbsp;&nbsp;&nbsp;struct _adv_properties properties = {0,};
 
-&nbsp;&nbsp;&nbsp;/* Scan response message configuration. */
+&nbsp;&nbsp;&nbsp;// Scan response message configuration
 &nbsp;&nbsp;&nbsp;properties.pkt_type = BT_ADAPTER_LE_PACKET_SCAN_RESPONSE;
 &nbsp;&nbsp;&nbsp;properties.name = true;
 &nbsp;&nbsp;&nbsp;properties.tx_power = false;
@@ -426,23 +391,21 @@ bool __set_scan_response_properties(bt_advertiser_h adv_h, int appearance)
 &nbsp;&nbsp;&nbsp;properties.manufacturer_id = MANUFACTURER_ID_SAMSUNG;
 &nbsp;&nbsp;&nbsp;properties.manufacturer_data.id = MANUFACTURER_ID_SAMSUNG;
 
-&nbsp;&nbsp;&nbsp;/* The configuration is applied to the advertiser. */
+&nbsp;&nbsp;&nbsp;// Configuration is applied to the advertiser
 &nbsp;&nbsp;&nbsp;return __set_properties(adv_h, properties);
 }
-</pre>
 
-<pre class="prettyprint">
-const char *heart_rate_measurement_model_get_uuid(void)
+const char 
+*heart_rate_measurement_model_get_uuid(void)
 {
-&nbsp;&nbsp;&nbsp;/* HRM_UUID is defined as string constant: "2A37". */
+&nbsp;&nbsp;&nbsp;// HRM_UUID is defined as string constant: &quot;2A37&quot;
 &nbsp;&nbsp;&nbsp;return HRM_UUID;
 }
-</pre>
 
-<pre class="prettyprint">
-const char *body_sensor_location_model_get_uuid(void)
+const char 
+*body_sensor_location_model_get_uuid(void)
 {
-&nbsp;&nbsp;&nbsp;/* BSL_UUID is defined as string constant: "2A38". */
+&nbsp;&nbsp;&nbsp;// BSL_UUID is defined as string constant: &quot;2A38&quot;
 &nbsp;&nbsp;&nbsp;return BSL_UUID;
 }
 </pre>
diff --git a/org.tizen.sampledescriptions/html/wearable_n/circlemusic_sd_wn.htm b/org.tizen.sampledescriptions/html/wearable_n/circlemusic_sd_wn.htm
new file mode 100644 (file)
index 0000000..8aa0894
--- /dev/null
@@ -0,0 +1,373 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+       <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+       <meta http-equiv="X-UA-Compatible" content="IE=9" />
+       <link rel="stylesheet" type="text/css" href="../css/styles.css" />
+       <link rel="stylesheet" type="text/css" href="../css/snippet.css" />
+       <script type="text/javascript" src="../scripts/snippet.js"></script>    
+       <script type="text/javascript" src="../scripts/jquery.util.js" charset="utf-8"></script>
+       <script type="text/javascript" src="../scripts/common.js" charset="utf-8"></script>
+       <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
+       <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>
+
+       <title>(Circle) Music Sample Overview</title>  
+</head>
+
+<body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
+
+<div id="toc-navigation">
+</div> 
+<div id="container"><div id="contents"><div class="content">
+
+       <div id="profile">
+               <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
+       </div>
+       
+
+
+
+<h1>(Circle) Music Sample Overview</h1> 
+
+<p>The (Circle) Music sample application demonstrates how to create a music application. Especially, it demonstrates how to draw the UI for a music player.</p>
+<p>The following figure illustrates the main screens of the (Circle) Music sample application.</p>
+<p class="figure">Figure: (Circle) Music main views</p>
+<p align="center"><img src="../images/music_wearable_sd.png" alt="(Circle) Music main views" /></p>
+
+<p>The application main view shows the control buttons for the music player, and displays the title and artist of the current song.</p>
+<p>The more button (3 dots) at the right side opens a selector component where you can define various player settings.</p>
+
+<h2>Implementation</h2>
+
+<h3>View</h3> 
+
+<p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the widget view frame that consists of, for example, a window, text parts, and image parts.</p>
+<pre class="prettyprint">
+view_create(context, w, h);
+</pre>
+
+<p class="figure">Figure: Music view frame</p>
+<p align="center"><img src="../images/music_structure_wearable_sd.png" alt="Music view frame" /></p>
+
+<p>To create the parts:</p>
+
+<ul>
+<li>Text
+<p>You can fill out text parts with the part name and text using the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function.</p>
+<p>First, implement the <span style="font-family: Courier New,Courier,monospace">data_get_music_title()</span> function to create the text to use. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
+<p>In this example, the text to use is <span style="font-family: Courier New,Courier,monospace">txt</span> and the part name to fill out is <span style="font-family: Courier New,Courier,monospace">txt.title</span>.</p>
+<pre class="prettyprint">
+txt = data_get_music_title(0);
+view_set_text(wid, &quot;txt.title&quot;, txt);
+</pre>
+</li>
+<li>Image
+<p>You can create an image object using the <span style="font-family: Courier New,Courier,monospace">view_set_image()</span> function. Pass the part name which you want to draw and the name of the image file including its directory path.</p>
+<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">sw.icon.device</span> and the <span style="font-family: Courier New,Courier,monospace">icon</span> parameter contains the path of an image file in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
+<pre class="prettyprint">
+icon = data_get_image(&quot;sw.icon.device&quot;);
+view_set_image(ad-&gt;content, &quot;sw.icon.device&quot;, icon);
+</pre>
+</li>
+<li>Button
+<p>You can create buttons using the <span style="font-family: Courier New,Courier,monospace">view_set_button()</span> function. Pass the part name, image path, button text, callback function, and user data.</p>
+<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">sw.icon.next</span> and the icon contains the path of an image file in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
+<pre class="prettyprint">
+view_set_button(ad-&gt;content, &quot;sw.icon.next&quot;, icon, NULL, _next_clicked_cb, ad);
+</pre>
+<p>The registered callback function is called when the button is clicked.</p>
+</li>
+<li>Progress bar
+<p>You can create a progress bar using the <span style="font-family: Courier New,Courier,monospace">view_set_prgressbar()</span> function. Pass the part name as a parameter.</p>
+<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">sw.progressbar</span>.</p>
+<pre class="prettyprint">
+view_set_prgressbar(ad-&gt;content, &quot;sw.progressbar&quot;);
+</pre> 
+
+<p>You can change the progressbar value using the <span style="font-family: Courier New,Courier,monospace">view_set_progressbar_val()</span> function.</p>
+<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">sw.progressbar</span> and the value you want to set is 70.</p>
+<pre class="prettyprint">
+view_set_progressbar_val(ad-&gt;content, &quot;sw.progressbar&quot;, 70);
+</pre>
+</li>
+<li>More button
+<p>You can create a more button using the <span style="font-family: Courier New,Courier,monospace">view_set_more_button()</span> function. Pass the part name as a parameter.</p>
+<pre class="prettyprint">
+view_set_more_button(ad-&gt;content, &quot;sw.more&quot;);
+</pre>
+<p>You can add items to the more button using the <span style="font-family: Courier New,Courier,monospace">view_add_more_button_item()</span> function. In this example, the more button part name is <span style="font-family: Courier New,Courier,monospace">sw.more</span>, and <span style="font-family: Courier New,Courier,monospace">main_txt</span> and <span style="font-family: Courier New,Courier,monospace">sub_txt</span> parameters define the text displayed when the item is selected. The <span style="font-family: Courier New,Courier,monospace">img_path</span> contains the path of the image file in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
+<p>You can also register a callback function with user data.</p>
+<pre class="prettyprint">
+view_add_more_button_item(ad-&gt;content, &quot;sw.more&quot;, main_txt, sub_txt, img_path, _item_clicked_cb, ad);
+</pre>
+</li>
+</ul>
+
+<h3>Main Operation</h3> 
+
+<p>To create the music application:</p>
+<ol>
+<li>Create the music application UI.
+<p>The application starts with the <span style="font-family: Courier New,Courier,monospace">main()</span> function, where the life-cycle callbacks are registered. The <span style="font-family: Courier New,Courier,monospace">app_create()</span> callback function is called first. After that, the <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the base UI of the application.</p>
+<pre class="prettyprint">
+static bool
+app_create(void *data)
+{
+&nbsp;&nbsp;&nbsp;// Hook to take necessary actions before the main event loop starts
+&nbsp;&nbsp;&nbsp;// Initialize UI resources and application data
+&nbsp;&nbsp;&nbsp;// If this function returns true, the application main loop starts
+&nbsp;&nbsp;&nbsp;// If this function returns false, the application is terminated
+&nbsp;&nbsp;&nbsp;appdata_s *ad = data;
+&nbsp;&nbsp;&nbsp;char *bg = NULL;
+&nbsp;&nbsp;&nbsp;char *icon = NULL;
+&nbsp;&nbsp;&nbsp;char *txt = NULL;
+&nbsp;&nbsp;&nbsp;int i = 0;
+
+&nbsp;&nbsp;&nbsp;view_create(ad);
+
+&nbsp;&nbsp;&nbsp;bg = data_get_image(&quot;sw.bg&quot;);
+&nbsp;&nbsp;&nbsp;view_set_image(ad-&gt;content, &quot;sw.bg&quot;, bg);
+&nbsp;&nbsp;&nbsp;free(bg);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.icon.vol&quot;);
+&nbsp;&nbsp;&nbsp;view_set_button(ad-&gt;content, &quot;sw.icon.vol&quot;, icon, NULL, _clicked_cb, &quot;volume&quot;);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.icon.vol&quot;, 250, 250, 250, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.progressbar.bg&quot;);
+&nbsp;&nbsp;&nbsp;view_set_image(ad-&gt;content, &quot;sw.progressbar.bg&quot;, icon);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.progressbar.bg&quot;, 0, 87, 107, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.icon.play&quot;);
+&nbsp;&nbsp;&nbsp;view_set_button(ad-&gt;content, &quot;sw.icon.play&quot;, icon, NULL, _clicked_cb, &quot;play&quot;);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.icon.play&quot;, 250, 250, 250, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.icon.prev&quot;);
+&nbsp;&nbsp;&nbsp;view_set_button(ad-&gt;content, &quot;sw.icon.prev&quot;, icon, NULL, _prev_clicked_cb, ad);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.icon.prev&quot;, 250, 250, 250, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.icon.next&quot;);
+&nbsp;&nbsp;&nbsp;view_set_button(ad-&gt;content, &quot;sw.icon.next&quot;, icon, NULL, _next_clicked_cb, ad);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.icon.next&quot;, 250, 250, 250, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;icon = data_get_image(&quot;sw.icon.device&quot;);
+&nbsp;&nbsp;&nbsp;view_set_image(ad-&gt;content, &quot;sw.icon.device&quot;, icon);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.icon.device&quot;, 250, 250, 250, 255);
+&nbsp;&nbsp;&nbsp;free(icon);
+
+&nbsp;&nbsp;&nbsp;txt = data_get_music_title(0);
+&nbsp;&nbsp;&nbsp;view_set_text(ad-&gt;content, &quot;txt.title&quot;, txt);
+&nbsp;&nbsp;&nbsp;free(txt);
+
+&nbsp;&nbsp;&nbsp;txt = data_get_music_artist(0);
+&nbsp;&nbsp;&nbsp;view_set_text(ad-&gt;content, &quot;txt.artist&quot;, txt);
+&nbsp;&nbsp;&nbsp;free(txt);
+
+&nbsp;&nbsp;&nbsp;evas_object_data_set(ad-&gt;content, &quot;__ALBUM_ORDER__&quot;, (void *)0);
+
+&nbsp;&nbsp;&nbsp;view_set_prgressbar(ad-&gt;content, &quot;sw.progressbar&quot;);
+&nbsp;&nbsp;&nbsp;view_set_color(ad-&gt;content, &quot;sw.progressbar&quot;, 0, 192, 235, 255);
+&nbsp;&nbsp;&nbsp;view_set_progressbar_val(ad-&gt;content, &quot;sw.progressbar&quot;, 70);
+
+&nbsp;&nbsp;&nbsp;view_set_more_button(ad-&gt;content, &quot;sw.more&quot;);
+&nbsp;&nbsp;&nbsp;for (i = 0; i &lt; 6; i++) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;view_add_more_button_item(ad-&gt;content,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&quot;sw.more&quot;,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;more_btn_item[i].main_txt,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;more_btn_item[i].sub_txt,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;more_btn_item[i].img_path,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_more_btn_item_clicked_cb,
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ad);
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;return true;
+}
+</pre>
+<p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the base UI that is composed of window, conformant, and layout components.</p>
+<p>The wearable profile does not support the indicator function, so use a conformant that does not set the indicator mode.</p>
+<pre class="prettyprint">
+void 
+view_create(appdata_s *ad)
+{
+&nbsp;&nbsp;&nbsp;ad-&gt;win = view_create_win();
+&nbsp;&nbsp;&nbsp;if (ad-&gt;win == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;window is NULL.&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;ad-&gt;conform = view_create_conformant(ad-&gt;win);
+&nbsp;&nbsp;&nbsp;if (ad-&gt;conform == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;failed to create a conformant&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;ad-&gt;content = view_create_layout_for_conformant(ad-&gt;win, ad-&gt;conform, EDJ_FILE, GRP_MAIN, ad);
+&nbsp;&nbsp;&nbsp;if (ad-&gt;content == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;evas_object_del(ad-&gt;win);
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;failed to create content.&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;// Show the window after the base GUI is set up
+&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;win);
+}
+</pre>
+<p>To create a layout for the conformant, you can use 2 methods. One of them involves creating an EDC file that you can customize, and the other uses a premade EDC file. The layout in this sample is created using a customized EDC file.</p>
+
+<pre class="prettyprint">
+Evas_Object*
+view_create_layout_for_conformant(Evas_Object *parent, Evas_Object *conformant, 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const char *file_name, const char *group_name, 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;void *user_data)
+{
+&nbsp;&nbsp;&nbsp;Evas_Object *layout = NULL;
+
+&nbsp;&nbsp;&nbsp;layout = view_create_layout(parent, file_name, group_name, user_data);
+&nbsp;&nbsp;&nbsp;if (layout == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;parent is NULL.&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return NULL;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;elm_object_content_set(conformant, layout);
+
+&nbsp;&nbsp;&nbsp;return layout;
+}
+</pre>
+</li>
+<li>Create a more button component with the <span style="font-family: Courier New,Courier,monospace">view_create_more_button()</span> function:
+<pre class="prettyprint">
+void 
+view_set_more_button(Evas_Object *parent, const char *part)
+{
+&nbsp;&nbsp;&nbsp;Evas_Object *more_btn = NULL;
+
+&nbsp;&nbsp;&nbsp;if (parent == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;parent is NULL.&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;more_btn = eext_more_option_add(parent);
+&nbsp;&nbsp;&nbsp;if (more_btn == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dlog_print(DLOG_ERROR, LOG_TAG, &quot;more option is NULL.&quot;);
+
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;// Add the smart callbacks
+&nbsp;&nbsp;&nbsp;evas_object_smart_callback_add(more_btn, &quot;more,option,opened&quot;, _more_option_opened, NULL);
+&nbsp;&nbsp;&nbsp;evas_object_smart_callback_add(more_btn, &quot;more,option,closed&quot;, _more_option_closed, NULL);
+&nbsp;&nbsp;&nbsp;evas_object_smart_callback_add(more_btn, &quot;item,selected&quot;, _item_selected, NULL);
+
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(parent, part, more_btn);
+}
+</pre>
+<p>You can add items to the more button component using the <span style="font-family: Courier New,Courier,monospace">view_add_more_button_item()</span> function:</p>
+<pre class="prettyprint">
+void 
+view_add_more_button_item(Evas_Object *parent, const char *part, const char *main_txt, 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const char *sub_txt, const char *img_path, 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;void (clicked_cb)(void *data, Evas_Object *obj, 
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;void *event_info), void *user_data)
+{
+&nbsp;&nbsp;&nbsp;Evas_Object *img = NULL;
+&nbsp;&nbsp;&nbsp;Evas_Object *more_btn = NULL;
+&nbsp;&nbsp;&nbsp;char full_path[PATH_MAX] = {0,};
+
+&nbsp;&nbsp;&nbsp;more_btn = elm_object_part_content_get(parent, part);
+&nbsp;&nbsp;&nbsp;if (more_btn == NULL) 
+&nbsp;&nbsp;&nbsp;{
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
+&nbsp;&nbsp;&nbsp;}
+
+&nbsp;&nbsp;&nbsp;// Create the new item
+&nbsp;&nbsp;&nbsp;Eext_Object_Item *item  = eext_more_option_item_append(more_btn);
+
+&nbsp;&nbsp;&nbsp;// Set the text in the item text part
+&nbsp;&nbsp;&nbsp;eext_more_option_item_part_text_set(item, &quot;selector,main_text&quot;, main_txt);
+&nbsp;&nbsp;&nbsp;eext_more_option_item_part_text_set(item, &quot;selector,sub_text&quot;, sub_txt);
+
+&nbsp;&nbsp;&nbsp;img = elm_image_add(more_btn);
+&nbsp;&nbsp;&nbsp;_get_resource(img_path, full_path, sizeof(full_path));
+&nbsp;&nbsp;&nbsp;elm_image_file_set(img, full_path, NULL);
+
+&nbsp;&nbsp;&nbsp;// Set the content in the item content part
+&nbsp;&nbsp;&nbsp;eext_more_option_item_part_content_set(item, &quot;item,icon&quot;, img);
+
+&nbsp;&nbsp;&nbsp;evas_object_smart_callback_add(more_btn, &quot;item,clicked&quot;, clicked_cb, user_data);
+}
+</pre>
+</li>
+<li>Define the callbacks for next or previous button clicks. 
+<p>If you click the next or previous button, the music information changes with the <span style="font-family: Courier New,Courier,monospace">_next_clicked_cb()</span> and <span style="font-family: Courier New,Courier,monospace">_prev_clicked_cb()</span> callbacks.</p>
+<pre class="prettyprint">
+static void 
+_next_clicked_cb(void *data, Evas_Object *obj, void *event_info)
+{
+&nbsp;&nbsp;&nbsp;appdata_s *ad = data;
+&nbsp;&nbsp;&nbsp;char *bg = NULL;
+&nbsp;&nbsp;&nbsp;char *title = NULL;
+&nbsp;&nbsp;&nbsp;char *artist = NULL;
+&nbsp;&nbsp;&nbsp;int index = 0;
+
+&nbsp;&nbsp;&nbsp;index = (int)evas_object_data_get(ad-&gt;content, &quot;__ALBUM_ORDER__&quot;);
+&nbsp;&nbsp;&nbsp;index = (index + 1) % 2;
+&nbsp;&nbsp;&nbsp;evas_object_data_set(ad-&gt;content, &quot;__ALBUM_ORDER__&quot;, (void *)index);
+
+&nbsp;&nbsp;&nbsp;dlog_print(DLOG_DEBUG, LOG_TAG, &quot;next button is clicked(%d)&quot;, index);
+
+&nbsp;&nbsp;&nbsp;bg = data_get_music_album_art(index);
+&nbsp;&nbsp;&nbsp;view_set_image(ad-&gt;content, &quot;sw.bg&quot;, bg);
+&nbsp;&nbsp;&nbsp;free(bg);
+
+&nbsp;&nbsp;&nbsp;title = data_get_music_title(index);
+&nbsp;&nbsp;&nbsp;view_set_text(ad-&gt;content, &quot;txt.title&quot;, title);
+&nbsp;&nbsp;&nbsp;free(title);
+
+&nbsp;&nbsp;&nbsp;artist = data_get_music_artist(index);
+&nbsp;&nbsp;&nbsp;view_set_text(ad-&gt;content, &quot;txt.artist&quot;, artist);
+&nbsp;&nbsp;&nbsp;free(artist);
+}
+</pre>
+</li>
+</ol>
+
+<script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
+<script type="text/javascript" src="../scripts/showhide.js"></script>
+</div></div></div>
+
+<a class="top sms" href="#"><img src="../images/btn_top.gif" alt="Go to top" /></a>
+
+<div id="footer">
+<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>
+</div>
+
+<script type="text/javascript">
+var _gaq = _gaq || [];
+_gaq.push(['_setAccount', 'UA-25976949-1']);
+_gaq.push(['_trackPageview']);
+(function() {
+var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+})();
+</script>
+
+</body>
+</html>
+
index f079f4e..cc5678d 100644 (file)
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-<head>
-       <meta http-equiv="content-type" content="text/html; charset=utf-8" />
-       <meta http-equiv="X-UA-Compatible" content="IE=9" />
-       <link rel="stylesheet" type="text/css" href="../css/styles.css" />
-       <link rel="stylesheet" type="text/css" href="../css/snippet.css" />
-       <script type="text/javascript" src="../scripts/snippet.js"></script>    
-       <script type="text/javascript" src="../scripts/jquery.util.js" charset="utf-8"></script>
-       <script type="text/javascript" src="../scripts/common.js" charset="utf-8"></script>
-       <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
-       <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>
-
-       <title>(Circle) Rotary Timer Sample Overview</title>  
-</head>
-
-<body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
-
-<div id="toc-navigation">
-</div> 
-
-<div id="container"><div id="contents"><div class="content">
-       <div id="profile">
-               <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
-       </div>
-
-  <h1>(Circle) Rotary Timer Sample Overview</h1> 
-  
-<p>The (Circle) Rotary Timer sample application demonstrates how you can implement a circular digital clock with a timer function in your application.</p>
-
-<p>The following figure illustrates the main views of the (Circle) Rotary Timer sample application.</p>
-
-<p class="figure">Figure: (Circle) Rotary Timer main views</p> 
-  <p align="center"><img alt="(Circle) Rotary Timer main views" src="../images/rotary_timer.png" /> <img alt="(Circle) Rotary Timer main views" src="../images/rotary_timer_set.png" /></p>
-
-<p>Click the hour, minute, and second values to set up the timer. To start the timer, click <strong>START</strong>.</p>  
-<p>The timer is stops when the number in the digital clock is reduced to 0. To set another time, click <strong>RESET</strong>.</p>
-  
-<h2>Implementation</h2>
-<p>To implement the circular rotary timer:</p>
-<ol>
-<li>Add the required header file and callbacks. 
-<p>To use the rotary function, the application must include the <span style="font-family: Courier New,Courier,monospace">efl_extension.h</span> header file. To detect rotary events, add the necessary callback functions.</p>
-
-<pre class="prettyprint">eext_rotary_object_event_activated_set(ad-&gt;layout, EINA_TRUE);
-eext_rotary_object_event_callback_add(ad-&gt;layout, _rotary_cb, ad);</pre>
-
-</li>
-
-<li>Create the layout for the timer preview. 
-<p>Use the <span style="font-family: Courier New,Courier,monospace">_layout_create()</span> function to create the main layout of the application, and add a digital clock to display the timer preview.</p>
-
-<pre class="prettyprint">static Evas_Object *
-_layout_create(appdata_s *ad)
-{
-&nbsp;&nbsp;&nbsp;_D(&quot;Layout create&quot;);
-&nbsp;&nbsp;&nbsp;Evas_Object *layout = NULL;
-
-&nbsp;&nbsp;&nbsp;retv_if(!ad, NULL);
-
-&nbsp;&nbsp;&nbsp;layout = elm_layout_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;retv_if(!layout, NULL);
-
-&nbsp;&nbsp;&nbsp;main_get_resource_path(ad);
-
-&nbsp;&nbsp;&nbsp;// ad-&gt;timer_edj_path == app_get_resource_path() + /edje/timer.edj
-&nbsp;&nbsp;&nbsp;elm_layout_file_set(layout, ad-&gt;timer_edj_path, GRP_MAIN);
-&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-&nbsp;&nbsp;&nbsp;eext_object_event_callback_add(layout, EEXT_CALLBACK_BACK, layout_back_cb, ad);
-
-&nbsp;&nbsp;&nbsp;elm_object_content_set(ad-&gt;conform, layout);
-&nbsp;&nbsp;&nbsp;ad-&gt;layout = layout;
-
-&nbsp;&nbsp;&nbsp;_start_btn_create(ad);
-&nbsp;&nbsp;&nbsp;retv_if(!ad-&gt;start_btn, NULL);
-
-&nbsp;&nbsp;&nbsp;digital_create(ad);
-
-&nbsp;&nbsp;&nbsp;rotary_init(ad);
-
-&nbsp;&nbsp;&nbsp;evas_object_show(layout);
-
-&nbsp;&nbsp;&nbsp;return layout;
-}</pre>
-</li>
-
-<li>Initialize the application and set the timer. 
-<p>Use the <span style="font-family: Courier New,Courier,monospace">digital_create()</span> function to create the digital clock and set the quantity of time for the timer.</p>
-
-<pre class="prettyprint">void 
-digital_create(appdata_s *ad)
-{
-&nbsp;&nbsp;&nbsp;_D(&quot;Digital create&quot;);
-&nbsp;&nbsp;&nbsp;Evas_Object *left_col = NULL;
-&nbsp;&nbsp;&nbsp;Evas_Object *right_col = NULL;
-
-&nbsp;&nbsp;&nbsp;ad-&gt;hour_ly = elm_layout_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;hour_ly);
-&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;hour_ly, ad-&gt;timer_edj_path, &quot;hour&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;hour_ly, EVAS_CALLBACK_MOUSE_DOWN, _hour_selected_cb, ad);
-&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;hour&quot;, ad-&gt;hour_ly);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;hour_ly);
-
-&nbsp;&nbsp;&nbsp;ad-&gt;minute_ly = elm_layout_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;minute_ly);
-&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;minute_ly, ad-&gt;timer_edj_path, &quot;minute&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;minute_ly, EVAS_CALLBACK_MOUSE_DOWN, _minute_selected_cb, ad);
-&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;minute&quot;, ad-&gt;minute_ly);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;minute_ly);
-
-&nbsp;&nbsp;&nbsp;ad-&gt;second_ly = elm_layout_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;second_ly);
-&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;second_ly, ad-&gt;timer_edj_path, &quot;second&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;second_ly, EVAS_CALLBACK_MOUSE_DOWN, _second_selected_cb, ad);
-&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;second&quot;, ad-&gt;second_ly);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;second_ly);
-
-&nbsp;&nbsp;&nbsp;left_col = elm_image_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;ret_if(!left_col);
-&nbsp;&nbsp;&nbsp;elm_image_file_set(left_col, ad-&gt;timer_control_dot_path, NULL);
-&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(left_col, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-&nbsp;&nbsp;&nbsp;evas_object_size_hint_align_set(left_col, EVAS_HINT_FILL, EVAS_HINT_FILL);
-&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;left_colon&quot;, left_col);
-
-&nbsp;&nbsp;&nbsp;right_col = elm_image_add(ad-&gt;win);
-&nbsp;&nbsp;&nbsp;ret_if(!right_col);
-&nbsp;&nbsp;&nbsp;elm_image_file_set(right_col, ad-&gt;timer_control_dot_path, NULL);
-&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(right_col, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-&nbsp;&nbsp;&nbsp;evas_object_size_hint_align_set(right_col, EVAS_HINT_FILL, EVAS_HINT_FILL);
-&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;right_colon&quot;, right_col);
-}</pre>
-
-</li>
-
-<li>Start the timer. 
-<p>The <span style="font-family: Courier New,Courier,monospace">_start_clicked_cb()</span> callback starts the timer. When you click <strong>START</strong>, the application calculates the quantity of time using the <span style="font-family: Courier New,Courier,monospace">_calc_setting_time()</span> function and displays the total time. The <span style="font-family: Courier New,Courier,monospace">_timer_start_cb()</span> function is called every second to reduce the number in the digital clock.</p>
-
-<pre class="prettyprint">static void 
-_start_clicked_cb(void *data, Evas_Object *obj, void *event_info)
-{
-&nbsp;&nbsp;&nbsp;if (ad-&gt;timer) 
-&nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_reset_clicked_cb(ad);
-
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;
-&nbsp;&nbsp;&nbsp;}
-&nbsp;&nbsp;&nbsp;ad-&gt;setting_time = _calc_setting_time(ad);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;setting_time);
-
-&nbsp;&nbsp;&nbsp;ad-&gt;img_num = 60; 
-
-&nbsp;&nbsp;&nbsp;progress_count = (ad-&gt;setting_time/ad-&gt;img_num);
-&nbsp;&nbsp;&nbsp;ad-&gt;selected = NULL;
-
-&nbsp;&nbsp;&nbsp;// Make the digital clock unclickable
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;hour_ly, &quot;hour_deselected&quot;, &quot;hour&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;minute_ly, &quot;minute_deselected&quot;, &quot;minute&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;second_ly, &quot;second_deselected&quot;, &quot;second&quot;);
-
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;start_btn_ly, &quot;timer_start&quot;, &quot;btn&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_start&quot;, &quot;bg&quot;);
-
-&nbsp;&nbsp;&nbsp;// Reduce 1 second every second
-&nbsp;&nbsp;&nbsp;ad-&gt;timer = ecore_timer_add(1.0f, _timer_start_cb, ad);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;timer);
-&nbsp;&nbsp;&nbsp;ad-&gt;progress_timer = ecore_timer_add(progress_count, _progress_start_cb, ad);
-&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;progress_timer);
-&nbsp;&nbsp;&nbsp;_progress_start_cb(ad);
-}
-
-static Eina_Bool 
-_timer_start_cb(void *data)
-{
-&nbsp;&nbsp;&nbsp;// Get the previous time
-&nbsp;&nbsp;&nbsp;pre_second_time = elm_object_part_text_get(ad-&gt;second_ly, &quot;val&quot;);
-&nbsp;&nbsp;&nbsp;post_second_time = atoi(pre_second_time);
-&nbsp;&nbsp;&nbsp;pre_minute_time = elm_object_part_text_get(ad-&gt;minute_ly, &quot;val&quot;);
-&nbsp;&nbsp;&nbsp;post_minute_time = atoi(pre_minute_time);
-&nbsp;&nbsp;&nbsp;pre_hour_time = elm_object_part_text_get(ad-&gt;hour_ly, &quot;val&quot;);
-&nbsp;&nbsp;&nbsp;post_hour_time = atoi(pre_hour_time);
-&nbsp;&nbsp;&nbsp;// Reduce 1 second
-&nbsp;&nbsp;&nbsp;if (post_second_time == 0) 
-&nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (post_minute_time == 0) 
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = 59;
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_minute_time = 59;
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_hour_time = post_hour_time - 1;
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} 
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;else 
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = 59;
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_minute_time = post_minute_time - 1;
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
-&nbsp;&nbsp;&nbsp;} 
-&nbsp;&nbsp;&nbsp;else 
-&nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = post_second_time - 1;
-&nbsp;&nbsp;&nbsp;}
-&nbsp;&nbsp;&nbsp;// Display the new time
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, hour_val);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, minute_val);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, second_val);
-               
-&nbsp;&nbsp;&nbsp;ad-&gt;setting_time--;
-
-&nbsp;&nbsp;&nbsp;free(hour_val);
-&nbsp;&nbsp;&nbsp;free(minute_val);
-&nbsp;&nbsp;&nbsp;free(second_val);
-
-&nbsp;&nbsp;&nbsp;return ECORE_CALLBACK_RENEW;
-}</pre>
-</li>
-
-<li>Reset the timer. 
-<p>To set another time when the user clicks <strong>RESET</strong>, call the <span style="font-family: Courier New,Courier,monospace">_reset_clicked_cb()</span> callback function.</p>
-
-<pre class="prettyprint">static void 
-_reset_clicked_cb(appdata_s *ad)
-{
-&nbsp;&nbsp;&nbsp;ad-&gt;setting_time = 0;
-
-&nbsp;&nbsp;&nbsp;ecore_timer_del(ad-&gt;timer);
-&nbsp;&nbsp;&nbsp;ad-&gt;timer = NULL;
-&nbsp;&nbsp;&nbsp;ecore_timer_del(ad-&gt;progress_timer);
-&nbsp;&nbsp;&nbsp;ad-&gt;progress_timer = NULL;
-
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, &quot;00&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;start_btn_ly, &quot;timer_end&quot;, &quot;btn&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_end&quot;, &quot;bg&quot;);
-&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_end&quot;, &quot;progress&quot;);
-}</pre>
-</li>
-</ol>
-
-<script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
-<script type="text/javascript" src="../scripts/showhide.js"></script>
-</div></div></div>
-
-<a class="top sms" href="#"><img src="../images/btn_top.gif" alt="Go to top" /></a>
-
-<div id="footer">
-<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>
-</div>
-
-<script type="text/javascript">
-var _gaq = _gaq || [];
-_gaq.push(['_setAccount', 'UA-25976949-1']);
-_gaq.push(['_trackPageview']);
-(function() {
-var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-})();
-</script>
-
-</body>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\r
+<head>\r
+       <meta http-equiv="content-type" content="text/html; charset=utf-8" />\r
+       <meta http-equiv="X-UA-Compatible" content="IE=9" />\r
+       <link rel="stylesheet" type="text/css" href="../css/styles.css" />\r
+       <link rel="stylesheet" type="text/css" href="../css/snippet.css" />\r
+       <script type="text/javascript" src="../scripts/snippet.js"></script>    \r
+       <script type="text/javascript" src="../scripts/jquery.util.js" charset="utf-8"></script>\r
+       <script type="text/javascript" src="../scripts/common.js" charset="utf-8"></script>\r
+       <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>\r
+       <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>\r
+\r
+       <title>(Circle) Rotary Timer Sample Overview</title>  \r
+</head>\r
+\r
+<body class="no-toc" onload="prettyPrint()" style="overflow: auto;">\r
+\r
+<div id="toc-navigation">\r
+</div> \r
+\r
+<div id="container"><div id="contents"><div class="content">\r
+       <div id="profile">\r
+               <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>\r
+       </div>\r
+\r
+  <h1>(Circle) Rotary Timer Sample Overview</h1> \r
+  \r
+<p>The (Circle) Rotary Timer sample application demonstrates how you can implement a circular digital clock with a timer function in your application.</p>\r
+\r
+<p>The following figure illustrates the main views of the (Circle) Rotary Timer sample application.</p>\r
+\r
+<p class="figure">Figure: (Circle) Rotary Timer main views</p> \r
+  <p align="center"><img alt="(Circle) Rotary Timer main views" src="../images/rotary_timer.png" /> <img alt="(Circle) Rotary Timer main views" src="../images/rotary_timer_set.png" /></p>\r
+\r
+<p>Click the hour, minute, and second values to set up the timer. To start the timer, click <strong>START</strong>.</p>  \r
+<p>The timer is stops when the number in the digital clock is reduced to 0. To set another time, click <strong>RESET</strong>.</p>\r
+  \r
+<h2>Implementation</h2>\r
+<p>To implement the circular rotary timer:</p>\r
+<ol>\r
+<li>Add the required header file and callbacks. \r
+<p>To use the rotary function, the application must include the <span style="font-family: Courier New,Courier,monospace">efl_extension.h</span> header file. To detect rotary events, add the necessary callback functions.</p>\r
+\r
+<pre class="prettyprint">eext_rotary_object_event_activated_set(ad-&gt;layout, EINA_TRUE);\r
+eext_rotary_object_event_callback_add(ad-&gt;layout, _rotary_cb, ad);</pre>\r
+\r
+</li>\r
+\r
+<li>Create the layout for the timer preview. \r
+<p>Use the <span style="font-family: Courier New,Courier,monospace">_layout_create()</span> function to create the main layout of the application, and add a digital clock to display the timer preview.</p>\r
+\r
+<pre class="prettyprint">static Evas_Object *\r
+_layout_create(appdata_s *ad)\r
+{\r
+&nbsp;&nbsp;&nbsp;_D(&quot;Layout create&quot;);\r
+&nbsp;&nbsp;&nbsp;Evas_Object *layout = NULL;\r
+\r
+&nbsp;&nbsp;&nbsp;retv_if(!ad, NULL);\r
+\r
+&nbsp;&nbsp;&nbsp;layout = elm_layout_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;retv_if(!layout, NULL);\r
+\r
+&nbsp;&nbsp;&nbsp;main_get_resource_path(ad);\r
+\r
+&nbsp;&nbsp;&nbsp;// ad-&gt;timer_edj_path == app_get_resource_path() + /edje/timer.edj\r
+&nbsp;&nbsp;&nbsp;elm_layout_file_set(layout, ad-&gt;timer_edj_path, GRP_MAIN);\r
+&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);\r
+&nbsp;&nbsp;&nbsp;eext_object_event_callback_add(layout, EEXT_CALLBACK_BACK, layout_back_cb, ad);\r
+\r
+&nbsp;&nbsp;&nbsp;elm_object_content_set(ad-&gt;conform, layout);\r
+&nbsp;&nbsp;&nbsp;ad-&gt;layout = layout;\r
+\r
+&nbsp;&nbsp;&nbsp;_start_btn_create(ad);\r
+&nbsp;&nbsp;&nbsp;retv_if(!ad-&gt;start_btn, NULL);\r
+\r
+&nbsp;&nbsp;&nbsp;digital_create(ad);\r
+\r
+&nbsp;&nbsp;&nbsp;rotary_init(ad);\r
+\r
+&nbsp;&nbsp;&nbsp;evas_object_show(layout);\r
+\r
+&nbsp;&nbsp;&nbsp;return layout;\r
+}</pre>\r
+</li>\r
+\r
+<li>Initialize the application and set the timer. \r
+<p>Use the <span style="font-family: Courier New,Courier,monospace">digital_create()</span> function to create the digital clock and set the quantity of time for the timer.</p>\r
+\r
+<pre class="prettyprint">void \r
+digital_create(appdata_s *ad)\r
+{\r
+&nbsp;&nbsp;&nbsp;_D(&quot;Digital create&quot;);\r
+&nbsp;&nbsp;&nbsp;Evas_Object *left_col = NULL;\r
+&nbsp;&nbsp;&nbsp;Evas_Object *right_col = NULL;\r
+\r
+&nbsp;&nbsp;&nbsp;ad-&gt;hour_ly = elm_layout_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;hour_ly);\r
+&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;hour_ly, ad-&gt;timer_edj_path, &quot;hour&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;hour_ly, EVAS_CALLBACK_MOUSE_DOWN, _hour_selected_cb, ad);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;hour&quot;, ad-&gt;hour_ly);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;hour_ly);\r
+\r
+&nbsp;&nbsp;&nbsp;ad-&gt;minute_ly = elm_layout_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;minute_ly);\r
+&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;minute_ly, ad-&gt;timer_edj_path, &quot;minute&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;minute_ly, EVAS_CALLBACK_MOUSE_DOWN, _minute_selected_cb, ad);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;minute&quot;, ad-&gt;minute_ly);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;minute_ly);\r
+\r
+&nbsp;&nbsp;&nbsp;ad-&gt;second_ly = elm_layout_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;second_ly);\r
+&nbsp;&nbsp;&nbsp;elm_layout_file_set(ad-&gt;second_ly, ad-&gt;timer_edj_path, &quot;second&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_event_callback_add(ad-&gt;second_ly, EVAS_CALLBACK_MOUSE_DOWN, _second_selected_cb, ad);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;second&quot;, ad-&gt;second_ly);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;second_ly);\r
+\r
+&nbsp;&nbsp;&nbsp;left_col = elm_image_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;ret_if(!left_col);\r
+&nbsp;&nbsp;&nbsp;elm_image_file_set(left_col, ad-&gt;timer_control_dot_path, NULL);\r
+&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(left_col, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);\r
+&nbsp;&nbsp;&nbsp;evas_object_size_hint_align_set(left_col, EVAS_HINT_FILL, EVAS_HINT_FILL);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;left_colon&quot;, left_col);\r
+\r
+&nbsp;&nbsp;&nbsp;right_col = elm_image_add(ad-&gt;win);\r
+&nbsp;&nbsp;&nbsp;ret_if(!right_col);\r
+&nbsp;&nbsp;&nbsp;elm_image_file_set(right_col, ad-&gt;timer_control_dot_path, NULL);\r
+&nbsp;&nbsp;&nbsp;evas_object_size_hint_weight_set(right_col, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);\r
+&nbsp;&nbsp;&nbsp;evas_object_size_hint_align_set(right_col, EVAS_HINT_FILL, EVAS_HINT_FILL);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_content_set(ad-&gt;layout, &quot;right_colon&quot;, right_col);\r
+}</pre>\r
+\r
+</li>\r
+\r
+<li>Start the timer. \r
+<p>The <span style="font-family: Courier New,Courier,monospace">_start_clicked_cb()</span> callback starts the timer. When you click <strong>START</strong>, the application calculates the quantity of time using the <span style="font-family: Courier New,Courier,monospace">_calc_setting_time()</span> function and displays the total time. The <span style="font-family: Courier New,Courier,monospace">_timer_start_cb()</span> function is called every second to reduce the number in the digital clock.</p>\r
+\r
+<pre class="prettyprint">static void \r
+_start_clicked_cb(void *data, Evas_Object *obj, void *event_info)\r
+{\r
+&nbsp;&nbsp;&nbsp;if (ad-&gt;timer) \r
+&nbsp;&nbsp;&nbsp;{\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_reset_clicked_cb(ad);\r
+\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;\r
+&nbsp;&nbsp;&nbsp;}\r
+&nbsp;&nbsp;&nbsp;ad-&gt;setting_time = _calc_setting_time(ad);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;setting_time);\r
+\r
+&nbsp;&nbsp;&nbsp;ad-&gt;img_num = 60; \r
+\r
+&nbsp;&nbsp;&nbsp;progress_count = (ad-&gt;setting_time/ad-&gt;img_num);\r
+&nbsp;&nbsp;&nbsp;ad-&gt;selected = NULL;\r
+\r
+&nbsp;&nbsp;&nbsp;// Make the digital clock unclickable\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;hour_ly, &quot;hour_deselected&quot;, &quot;hour&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;minute_ly, &quot;minute_deselected&quot;, &quot;minute&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;second_ly, &quot;second_deselected&quot;, &quot;second&quot;);\r
+\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;start_btn_ly, &quot;timer_start&quot;, &quot;btn&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_start&quot;, &quot;bg&quot;);\r
+\r
+&nbsp;&nbsp;&nbsp;// Reduce 1 second every second\r
+&nbsp;&nbsp;&nbsp;ad-&gt;timer = ecore_timer_add(1.0f, _timer_start_cb, ad);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;timer);\r
+&nbsp;&nbsp;&nbsp;ad-&gt;progress_timer = ecore_timer_add(progress_count, _progress_start_cb, ad);\r
+&nbsp;&nbsp;&nbsp;ret_if(!ad-&gt;progress_timer);\r
+&nbsp;&nbsp;&nbsp;_progress_start_cb(ad);\r
+}\r
+\r
+static Eina_Bool \r
+_timer_start_cb(void *data)\r
+{\r
+&nbsp;&nbsp;&nbsp;// Get the previous time\r
+&nbsp;&nbsp;&nbsp;pre_second_time = elm_object_part_text_get(ad-&gt;second_ly, &quot;val&quot;);\r
+&nbsp;&nbsp;&nbsp;post_second_time = atoi(pre_second_time);\r
+&nbsp;&nbsp;&nbsp;pre_minute_time = elm_object_part_text_get(ad-&gt;minute_ly, &quot;val&quot;);\r
+&nbsp;&nbsp;&nbsp;post_minute_time = atoi(pre_minute_time);\r
+&nbsp;&nbsp;&nbsp;pre_hour_time = elm_object_part_text_get(ad-&gt;hour_ly, &quot;val&quot;);\r
+&nbsp;&nbsp;&nbsp;post_hour_time = atoi(pre_hour_time);\r
+&nbsp;&nbsp;&nbsp;// Reduce 1 second\r
+&nbsp;&nbsp;&nbsp;if (post_second_time == 0) \r
+&nbsp;&nbsp;&nbsp;{\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (post_minute_time == 0) \r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = 59;\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_minute_time = 59;\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_hour_time = post_hour_time - 1;\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} \r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;else \r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = 59;\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_minute_time = post_minute_time - 1;\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}\r
+&nbsp;&nbsp;&nbsp;} \r
+&nbsp;&nbsp;&nbsp;else \r
+&nbsp;&nbsp;&nbsp;{\r
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;post_second_time = post_second_time - 1;\r
+&nbsp;&nbsp;&nbsp;}\r
+&nbsp;&nbsp;&nbsp;// Display the new time\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, hour_val);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, minute_val);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, second_val);\r
+               \r
+&nbsp;&nbsp;&nbsp;ad-&gt;setting_time--;\r
+\r
+&nbsp;&nbsp;&nbsp;free(hour_val);\r
+&nbsp;&nbsp;&nbsp;free(minute_val);\r
+&nbsp;&nbsp;&nbsp;free(second_val);\r
+\r
+&nbsp;&nbsp;&nbsp;return ECORE_CALLBACK_RENEW;\r
+}</pre>\r
+</li>\r
+\r
+<li>Reset the timer. \r
+<p>To set another time when the user clicks <strong>RESET</strong>, call the <span style="font-family: Courier New,Courier,monospace">_reset_clicked_cb()</span> callback function.</p>\r
+\r
+<pre class="prettyprint">static void \r
+_reset_clicked_cb(appdata_s *ad)\r
+{\r
+&nbsp;&nbsp;&nbsp;ad-&gt;setting_time = 0;\r
+\r
+&nbsp;&nbsp;&nbsp;ecore_timer_del(ad-&gt;timer);\r
+&nbsp;&nbsp;&nbsp;ad-&gt;timer = NULL;\r
+&nbsp;&nbsp;&nbsp;ecore_timer_del(ad-&gt;progress_timer);\r
+&nbsp;&nbsp;&nbsp;ad-&gt;progress_timer = NULL;\r
+\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;hour_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;minute_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_part_text_set(ad-&gt;second_ly, &quot;val&quot;, &quot;00&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;start_btn_ly, &quot;timer_end&quot;, &quot;btn&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_end&quot;, &quot;bg&quot;);\r
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(ad-&gt;layout, &quot;timer_end&quot;, &quot;progress&quot;);\r
+}</pre>\r
+</li>\r
+</ol>\r
+\r
+<script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>\r
+<script type="text/javascript" src="../scripts/showhide.js"></script>\r
+</div></div></div>\r
+\r
+<a class="top sms" href="#"><img src="../images/btn_top.gif" alt="Go to top" /></a>\r
+\r
+<div id="footer">\r
+<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>\r
+</div>\r
+\r
+<script type="text/javascript">\r
+var _gaq = _gaq || [];\r
+_gaq.push(['_setAccount', 'UA-25976949-1']);\r
+_gaq.push(['_trackPageview']);\r
+(function() {\r
+var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;\r
+ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';\r
+var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);\r
+})();\r
+</script>\r
+\r
+</body>\r
 </html>
\ No newline at end of file
index da7646a..c25f2bd 100644 (file)
@@ -220,7 +220,7 @@ _set_info_time_and_date(void *data, watch_time_h watch_time)
 &nbsp;&nbsp;&nbsp;int minute = 0;
 &nbsp;&nbsp;&nbsp;int day_of_week = 0;
 &nbsp;&nbsp;&nbsp;int month = 0;
-&nbsp;&nbsp;&nbsp;int day = 0 ;
+&nbsp;&nbsp;&nbsp;int day = 0;
 
 &nbsp;&nbsp;&nbsp;retvm_if(!watch_time, EINA_FALSE, &quot;watch_time is NULL&quot;);
 &nbsp;&nbsp;&nbsp;retvm_if(!ad, EINA_FALSE, &quot;appdata is NULL&quot;);
index df32496..fae5332 100644 (file)
@@ -11,7 +11,7 @@
        <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
        <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>
 
-       <title>New Briefing Widget Sample Overview</title>  
+       <title>News Briefing Widget Sample Overview</title>  
 </head>
 
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 </div> 
 
 
-<h1>New Briefing Widget Sample Overview</h1> 
+<h1>News Briefing Widget Sample Overview</h1> 
 
-<p>The New Briefing widget sample demonstrates how to manage text objects and image objects to create a complete widget view.</p>
-<p>The following figure illustrates the main screen of the New Briefing widget.</p>
-<p class="figure">Figure: New Briefing main view</p>
-<p align="center"><img src="../images/new_briefing_wearable_sd.png" alt="New Briefing main view" /></p>
+<p>The News Briefing Widget sample application demonstrates how to manage text objects and image objects to create a complete widget view.</p>
+<p>The following figure illustrates the main screen of the News Briefing Widget.</p>
+<p class="figure">Figure: News Briefing Widget main view</p>
+<p align="center"><img src="../images/new_briefing_wearable_sd.png" alt="News Briefing Widget main view" /></p>
 
-<p>This sample consists of the view and main operation parts.</p> 
+<p>The application displays a background image and some text elements on the screen.</p> 
 
-<h2>View</h2> 
+<h2>Implementation</h2>
+
+<h3>View</h3> 
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the widget view frame that consists of the window, text parts, and image parts.</p>
 <pre class="prettyprint">
 view_create(context, w, h);
 </pre>
-<p>The following figure illustrates the view frame.</p>
-<p class="figure">Figure: New Briefing view frame</p>
-<p align="center"><img src="../images/new_briefing_structure_wearable_sd.png" alt="New Briefing view frame" /></p>
+
+<p class="figure">Figure: News Briefing Widget view frame</p>
+<p align="center"><img src="../images/new_briefing_structure_wearable_sd.png" alt="News Briefing Widget view frame" /></p>
 
 <p>To create the parts:</p>
 <ul>
 <li>Text
 <p>You can fill out the text parts with the part name and the text using the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function.</p>
 
-<p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
+<p>First, implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
 <p>In this example, the text to use is <span style="font-family: Courier New,Courier,monospace">news_txt</span> and the part name to fill out is <span style="font-family: Courier New,Courier,monospace">widget.text</span>.</p>
 <pre class="prettyprint">
 news_txt = data_get_text(&quot;widget.text&quot;);
@@ -59,15 +61,15 @@ view_set_text(wid, &quot;widget.text&quot;, news_txt);
 </pre>
 </li>
 <li>Image
-<p>You can create a widget with image files using the <span style="font-family: Courier New,Courier,monospace">view_set_image()</span> function. Pass the part name which you want to draw and the name of image file including its directory path.</p>
-<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">widget.bg</span> and the name of image file is <span style="font-family: Courier New,Courier,monospace">bg.png</span> in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
+<p>You can create a widget with image files using the <span style="font-family: Courier New,Courier,monospace">view_set_image()</span> function. Pass the part name which you want to draw and the name of the image file including its directory path.</p>
+<p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">widget.bg</span> and the name of the image file is <span style="font-family: Courier New,Courier,monospace">bg.png</span> in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
 <pre class="prettyprint">
 view_set_image(wid, &quot;widget.bg&quot;, &quot;images/bg.png&quot;);
 </pre>
 </li>
 </ul>
 
-<h2>Main Operation</h2>
+<h3>Main Operation</h3>
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_set_event_callback()</span> function controls the widget main operation that launches the application.</p>
 <p>The launch options are:</p>
@@ -76,16 +78,12 @@ view_set_image(wid, &quot;widget.bg&quot;, &quot;images/bg.png&quot;);
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_RELEASED</span> for launch on a touch release event</li>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span> for launch on a click event</li>
 </ul>
-<p>In this example, the application is launched when you click the widget.</p>
+<p>In this example, the application is launched when you click the widget:</p>
 <pre class="prettyprint">
 view_set_event_callback(wid, &quot;widget.event&quot;, WIDGET_EVENT_CLICKED, clicked_cb);
 </pre>
 
 
-
-
-
-
 <script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
 <script type="text/javascript" src="../scripts/showhide.js"></script>
 </div></div></div>
index 8f9a586..851b243 100644 (file)
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 
 <div id="toc-navigation">
-
+</div> 
 <div id="container"><div id="contents"><div class="content">
 
        <div id="profile">
                <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
        </div>
        
-</div> 
+
 
 
 <h1>Scheduler Widget Sample Overview</h1> 
 
-<p>The Scheduler widget sample demonstrates how to manage text objects and image objects to create a complete widget view.</p>
-<p>The following figure illustrates the main screen of the Scheduler widget.</p>
-<p class="figure">Figure: Scheduler main view</p>
-<p align="center"><img src="../images/scheduler_wearable_sd.png" alt="Scheduler main view" /></p>
+<p>The Scheduler Widget sample application demonstrates how to manage text objects and image objects to create a complete widget view.</p>
+<p>The following figure illustrates the main screen of the Scheduler Widget.</p>
+<p class="figure">Figure: Scheduler Widget main view</p>
+<p align="center"><img src="../images/scheduler_wearable_sd.png" alt="Scheduler Widget main view" /></p>
+
+<p>The application displays the tasks for a specific day.</p> 
 
-<p>This sample consists of the view and main operation parts.</p> 
+<h2>Implementation</h2>
 
-<h2>View</h2
+<h3>View</h3
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the widget view frame that consists of the window, text parts, and image parts.</p>
 <pre class="prettyprint">
 view_create(context, w, h);
 </pre>
-<p>The following figure illustrates the view frame.</p>
-<p class="figure">Figure: Scheduler view frame</p>
-<p align="center"><img src="../images/scheduler_structure_wearable_sd.png" alt="Scheduler view frame" /></p>
 
-<p>To fill out text parts with the part name and the text, use the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function.</p>
+<p class="figure">Figure: Scheduler Widget view frame</p>
+<p align="center"><img src="../images/scheduler_structure_wearable_sd.png" alt="Scheduler Widget view frame" /></p>
+
+<p>To fill out the text parts:</p>
+
+<ol><li><p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out.</p></li>
+<li><p>Call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p></li></ol>
 
-<p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
 <p>In this example, the text to use is <span style="font-family: Courier New,Courier,monospace">txt_day</span> and the part name to fill out is <span style="font-family: Courier New,Courier,monospace">widget.day</span>.</p>
 <pre class="prettyprint">
 txt_day = data_get_text(&quot;widget.day&quot;);
 view_set_text(wid, &quot;widget.day&quot;, txt_day);
 </pre>
 
-<h2>Main Operation</h2>
+<h3>Main Operation</h3>
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_set_event_callback()</span> function controls the widget main operation that launches the application.</p>
 <p>The launch options are:</p>
@@ -64,16 +68,11 @@ view_set_text(wid, &quot;widget.day&quot;, txt_day);
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_RELEASED</span> for launch on a touch release event </li>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span>for launch on a click event</li>
 </ul>
-<p>In this example, the application is launched when you click the widget.</p>
+<p>In this example, the application is launched when you click the widget:</p>
 <pre class="prettyprint">
 view_set_event_callback(wid, &quot;widget.event&quot;, WIDGET_EVENT_CLICKED, clicked_cb);
 </pre>
 
-
-
-
-
-
 <script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
 <script type="text/javascript" src="../scripts/showhide.js"></script>
 </div></div></div>
index 83713da..1fdf988 100644 (file)
        <tr> 
      <td><a href="bluetoothchat_sd_wn.htm">(Circle) Bluetooth Chat</a></td> 
      <td>Demonstrates how you can send and receive data between 2 devices.</td>
-    </tr>
-       <tr>
-        <td><a href="bluetooth_le_service_sd_wn.htm">Bluetooth LE Service</a></td>
-        <td>Demonstrates how you can implement the data broadcasting (advertizing) via the Bluetooth Low Energy adapter.</td>
-       </tr>
+    </tr>      
        <tr> 
      <td><a href="cairo_basic_sd_wn.htm">(Circle) Cairo Basic</a></td> 
      <td>Demonstrates how you can implement the Cairo image backend.</td>
      <td><a href="circleemail_sd_wn.htm">(Circle) Email</a></td> 
      <td>Demonstrates how you can implement a complex circular email view using EFL UI components and containers.</td>
     </tr>
+       <tr> 
+     <td><a href="circlemusic_sd_wn.htm">(Circle) Music</a></td> 
+     <td>Demonstrates how you can create a music player application.</td>
+    </tr>              
        <tr>
      <td><a href="circlerotarytimer_sd_wn.htm">(Circle) Rotary Timer</a></td> 
      <td>Demonstrates how you can implement a circular digital clock with a timer function.</td>
      <td>Demonstrates how you can implement a complex circular settings view using EFL UI components and containers.</td>
     </tr>
        <tr> 
+     <td><a href="settings_sd_wn.htm">(Circle) System Settings UI</a></td> 
+     <td>Demonstrates how you can create a settings application.</td>
+    </tr>
+       <tr> 
      <td><a href="rectemail_sd_wn.htm">(Rectangle) Email</a></td> 
      <td>Demonstrates how you can implement a complex rectangular email view using EFL UI components and containers.</td>
     </tr>
         <td><a href="rectwidgetviewer_sd_wn.htm">(Rectangle) Widget Viewer</a></td>
         <td>Demonstrates how you can use the widget service and viewer.</td>
        </tr>
+               <tr>
+        <td><a href="alarm_widget_sd_wn.htm">Alarm Widget</a></td>
+        <td>Demonstrates how you can implement a simple alarm widget.</td>
+       </tr>
        <tr>
         <td><a href="ambientweather_sd_wn.htm">Ambient Weather</a></td>
         <td>Demonstrates how you can implement a simple watch with the current weather displayed in the ambient mode.</td>
      <td><a href="analog_watch_sd_wn.htm">Analog Watch</a></td> 
      <td>Demonstrates how you can implement an analog watch application.</td>
     </tr>
+    <tr>
+      <td><a href="bluetooth_le_service_sd_wn.htm">Bluetooth LE Service</a></td>
+      <td>Demonstrates how you can implement data broadcasting (advertising) through the Bluetooth Low Energy (LE) adapter.</td>
+    </tr>
        <tr> 
      <td><a href="digital_watch_sd_wn.htm">Digital-Watch</a></td> 
      <td>Demonstrates how you can implement a watch application.</td>
     </tr>
        <tr> 
      <td><a href="glview_shader_sd_wn.htm">GLViewShader</a></td> 
-     <td>Demonstrates how you can render more complex geometric shapes with OepnGL&reg; ES and use Elementary GLView helper macros to port existing code.</td>
-    </tr>      
+     <td>Demonstrates how you can render more complex geometric shapes with OpenGL&reg; ES and use Elementary GLView helper macros to port existing code.</td>
+    </tr>
+       <tr> 
+     <td><a href="new_briefing_widget_sd_wn.htm">News Briefing Widget</a></td> 
+     <td>Demonstrates how you can create a widget to show simple text information.</td>
+    </tr>
+       <tr> 
+     <td><a href="scheduler_widget_sd_wn.htm">Scheduler Widget</a></td> 
+     <td>Demonstrates how you can create a scheduler widget.</td>
+    </tr>
+       <tr> 
+     <td><a href="taskmanager_sd_wn.htm">Task-manager</a></td> 
+     <td>Demonstrates how you can view and delete recently used items.</td>
+    </tr>
        <tr> 
      <td><a href="widget_animation_sd_wn.htm">Widget Animation</a></td> 
      <td>Demonstrates how you can implement an animation to a widget application.</td>
     </tr>      
-
+       <tr> 
+     <td><a href="worldclock_widget_sd_wn.htm">World Clock Widget</a></td> 
+     <td>Demonstrates how you can create a world clock application.</td>
+    </tr>
    </tbody> 
   </table> 
  
index d5d53f5..2b36f69 100644 (file)
        <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
        <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>
 
-       <title>(Circle) Settings Sample Overview</title>  
+       <title>(Circle) System Settings UI Sample Overview</title>  
 </head>
 
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 
 <div id="toc-navigation">
-
+</div> 
 <div id="container"><div id="contents"><div class="content">
 
        <div id="profile">
                <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
        </div>
        
-</div> 
 
 
-<h1>(Circle) Settings Sample Overview</h1> 
 
-<p>The Settings sample application shows you how you can create a settings application. Especially, it demonstrates how to manage the naviframe and genlist components to create a complete view of settings application.</p>
-<p>The following figure illustrates the main screen of the Settings application.</p>
-<p class="figure">Figure: Settings main view</p>
-<p align="center"><img src="../images/settings_wearable_sd.png" alt="Settings main view" /></p>
+<h1>(Circle) System Settings UI Sample Overview</h1> 
 
+<p>The (Circle) System Settings UI sample application demonstrates how you can create a settings application. Especially, it demonstrates how to manage the naviframe and genlist components to create a complete view of settings application.</p>
+<p>The following figure illustrates the main screen of the (Circle) System Settings UI application.</p>
+<p class="figure">Figure: (Circle) System Settings UI main view</p>
+<p align="center"><img src="../images/settings_wearable_sd.png" alt="(Circle) System Settings UI main view" /></p>
 
+<p>The main view displays a selection of settings. Click a setting to change its related values.</p>
 
 <h2>Implementation</h2> 
 
 <p>To create the settings application:</p>
 <ol>
-<li>Create the Settings UI.
+<li>Create the settings UI.
 <p>The application starts with the <span style="font-family: Courier New,Courier,monospace;">main()</span> function, where the life-cycle callbacks are registered. The <span style="font-family: Courier New,Courier,monospace;">app_create()</span> callback function is called first. After that, the <span style="font-family: Courier New,Courier,monospace;">view_create()</span> function creates the base UI of the application.</p>
 <pre class="prettyprint">
 static bool
 app_create(void *data)
 {
-&nbsp;&nbsp;&nbsp;// Hook to take necessary actions before main event loop starts
+&nbsp;&nbsp;&nbsp;// Hook to take necessary actions before the main event loop starts
 &nbsp;&nbsp;&nbsp;// Initialize UI resources and application data
-&nbsp;&nbsp;&nbsp;// If this function returns true, the main loop of application starts
+&nbsp;&nbsp;&nbsp;// If this function returns true, the application main loop starts
 &nbsp;&nbsp;&nbsp;// If this function returns false, the application is terminated
 &nbsp;&nbsp;&nbsp;appdata_s *ad = data;
 
@@ -73,8 +73,8 @@ app_create(void *data)
 &nbsp;&nbsp;&nbsp;return true;
 }
 </pre>
-<p>The <span style="font-family: Courier New,Courier,monospace;">view_create()</span> function creates the base UI that is composed of window, conformant, layout, and naviframe components.</p>
-<p>The wearable profile does not support the indicator function, so use a conformant that does not set the indicator mode. After that, create a <span style="font-family: Courier New,Courier,monospace;">circle_surface</span> to display a circular genlist.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace;">view_create()</span> function creates the base UI that is composed of window, conformant, layout, and naviframe components. The wearable profile does not support the indicator function, so use a conformant that does not set the indicator mode.</p>
+<p>In addition, create a <span style="font-family: Courier New,Courier,monospace;">circle_surface</span> to display a circular genlist.</p>
 <pre class="prettyprint">
 void 
 view_create(appdata_s *ad)
@@ -114,7 +114,7 @@ view_create(appdata_s *ad)
 &nbsp;&nbsp;&nbsp;evas_object_show(ad-&gt;win);
 }
 </pre>
-<p>When it comes to layout, there are 2 methods to create layout component. One of them involves creating an edje file that you can customize, and the other uses a premade edje file. This layout is created using the premade edje file. The style can be changed with the <span style="font-family: Courier New,Courier,monospace;">elm_layout_theme_set()</span> function.</p>
+<p>To create a layout for the conformant, you can use 2 methods. One of them involves creating an edje file that you can customize, and the other uses a premade edje file. The layout in this sample is created using the premade edje file. The style can be changed with the <span style="font-family: Courier New,Courier,monospace;">elm_layout_theme_set()</span> function.</p>
 <pre class="prettyprint">
 Evas_Object* 
 view_create_layout_by_theme(Evas_Object *parent, const char *file_name, const char *group_name)
@@ -139,7 +139,8 @@ view_create_layout_by_theme(Evas_Object *parent, const char *file_name, const ch
 </pre>
 </li>
 <li>Create the genlist. 
-<p>The <span style="font-family: Courier New,Courier,monospace;">view_create_circle_genlist()</span> function creates the  genlist component. The genlist component sets the list mode with the <span style="font-family: Courier New,Courier,monospace;">elm_genlist_mode_set()</span> function. To display a circular genlist, create circular genlist component supported by EFL Extension. The <span style="font-family: Courier New,Courier,monospace;">eext_circle_object_genlist_scroller_policy_set()</span> function sets the scrollbar visibility policy.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace;">view_create_circle_genlist()</span> function creates the  genlist component, which sets the list mode with the <span style="font-family: Courier New,Courier,monospace;">elm_genlist_mode_set()</span> function.</p>
+<p>To display a circular genlist, create a circular genlist component supported by the <a href="../../../org.tizen.native.wearable.apireference/group__CAPI__EFL__EXTENSION__MODULE.html">Efl Extension</a> API. The <span style="font-family: Courier New,Courier,monospace;">eext_circle_object_genlist_scroller_policy_set()</span> function sets the scrollbar visibility policy.</p>
 <pre class="prettyprint">
 Evas_Object*
 view_create_circle_genlist(Evas_Object *parent, Eext_Circle_Surface *circle_surface)
@@ -175,8 +176,7 @@ view_create_circle_genlist(Evas_Object *parent, Eext_Circle_Surface *circle_surf
 }
 </pre>
 </li>
-<li>Insert an item to the genlist.
-<p>An item is inserted into genlist using the <span style="font-family: Courier New,Courier,monospace;">view_append_item_to_genlist()</span> function.</p>
+<li>Insert an item to the genlist using the <span style="font-family: Courier New,Courier,monospace;">view_append_item_to_genlist()</span> function:
 <pre class="prettyprint">
 void 
 view_append_item_to_genlist(Evas_Object *genlist, const char *style,
@@ -205,7 +205,7 @@ view_append_item_to_genlist(Evas_Object *genlist, const char *style,
 &nbsp;&nbsp;&nbsp;elm_genlist_item_class_free(item_class);
 }
 </pre>
-<p>Before the item is inserted into genlist, the item class must be set. The <span style="font-family: Courier New,Courier,monospace;">_set_genlist_item_class()</span> function sets the class for each item and registers the functions to get the text and contents. These functions are called when the <span style="font-family: Courier New,Courier,monospace;">elm_genlist_item_append()</span> function runs, and they receive data as a parameter.</p>
+<p>Before the item is inserted into the genlist, the item class must be set. The <span style="font-family: Courier New,Courier,monospace;">_set_genlist_item_class()</span> function sets the class for each item and registers the functions to get the text and contents. These functions are called when the <span style="font-family: Courier New,Courier,monospace;">elm_genlist_item_append()</span> function runs, and they receive data as a parameter.</p>
 <pre class="prettyprint">
 static Elm_Genlist_Item_Class* 
 _set_genlist_item_class(const char *style)
@@ -255,9 +255,8 @@ _set_genlist_item_class(const char *style)
 &nbsp;&nbsp;&nbsp;} 
 &nbsp;&nbsp;&nbsp;else if (!strcmp(style, &quot;padding&quot;))
 &nbsp;&nbsp;&nbsp;{
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// @note
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// &quot;padding&quot; style does nothing
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// But it makes genlist item placed in the middle of the screen
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// It only places the genlist item in the middle of the screen
 &nbsp;&nbsp;&nbsp;}
 
 &nbsp;&nbsp;&nbsp;return item_class;
index 62cd7f7..436204f 100644 (file)
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 
 <div id="toc-navigation">
-
+</div> 
 <div id="container"><div id="contents"><div class="content">
 
        <div id="profile">
                <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
        </div>
        
-</div> 
+
 
 
 <h1>Task-manager Sample Overview</h1> 
 
-<p>The Task-manager sample application demonstrates how you can see the recently used items and delete them. By controlling the scroller, box, list, and index, you can learn to manage several items and pages on Tizen.</p>
+<p>The Task-manager sample application demonstrates how you can see the recently used items and delete them. By using the scroller, box, list, and index components, you can manage multiple items and pages in Tizen.</p>
 <p>The following figure illustrates the main screens of the Task-manager.</p>
 <p class="figure">Figure: Task-manager views</p>
-<p align="center"><img src="../images/taskmanager_wearable_sd.png" alt="Task-manager main view" /></p>
+<p align="center"><img src="../images/taskmanager_wearable_sd.png" alt="Task-manager views" /></p>
+
+<p>You can scroll through the items using the horizontal scroller. The index at the top of the screen shows where within the item list you are currently located.</p>
+<p>You can delete an individual item or close all items.</p>
+
+<h2>Implementation</h2>
+
+<h3>View</h3> 
+
+<p>The following figure illustrates the view structure: the recently used items are located in a box, and a scroller can be used to move between items.</p>
 
-<p>This sample consists of the following:</p> 
-<ul>
-<li>View
 <p class="figure">Figure: Task-manager view structure</p>
 <p align="center"><img src="../images/taskmanager_view_wearable_sd.png" alt="Task-manager view structure" /></p>
-</li>
-<li>Main operation 
-<ul>
-<li>Delete item</li>
-<li>Show the index according to the current page</li>
-<li>Close all items</li>
-</ul>
-</li>
-</ul>
 
-<h2>View</h2> 
 
-<p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the window, conformant, and layout frame as illustrated in the following figure.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the view frame that consists of the window, conformant, and layout.</p>
 <p class="figure">Figure: Task-manager frame structure</p>
 <p align="center"><img src="../images/taskmanager_layout_wearable_sd.png" alt="Task-manager frame structure" /></p>
 
 <p>To create the parts:</p>
 <ul>
-<li><span style="font-family: Courier New,Courier,monospace">task.item.list</span>
-<p>This part is for items, and consists of scroller, box, and items.</p>
+<li><span style="font-family: Courier New,Courier,monospace">task.item.list</span> part consists of the scroller, box, and items.
 <ol>
 <li>Create the components and the layout.
-<p>To manage several items, the scroller and box components are required.</p>
-<p>The scroller makes this application scrollable, and the box allows this application to show several items through packaging and arrangement.</p>
+<p>To manage multiple items, you need the scroller and box components. The scroller makes the application scrollable, and the box allows the application to show multiple items through packaging and arrangement.</p>
 <p>The following example creates a horizontal scroller and a box which packs the items horizontally.</p>
 <pre class="prettyprint">
 ad-&gt;scroller = view_create_horizontal_scroller(ad);
 ad-&gt;box = view_create_horizontal_box(ad);
 </pre>
 
-<p>The following figure illustrates the structure of the scroller and the box.</p>
+<p>The following figure illustrates the structure of the scroller (pink) and the box (blue).</p>
 <p class="figure">Figure: Scroller and box</p>
 <p align="center"><img src="../images/taskmanager_scrollerbox_wearable_sd.png" alt="Scroller and box" /></p>
-<p>The following function creates the layout frame for the item. It consists of text and image.</p>
+
+<p>Create the layout frame for each item, consisting of text and images:</p>
 <pre class="prettyprint">
 item_layout = view_create_layout(ad-&gt;layout, edj_path, GRP_ITEM);
 </pre>
-<p>The following figure illustrates the item layout.</p>
 <p class="figure">Figure: Item layout</p>
 <p align="center"><img src="../images/taskmanager_item_layout_wearable_sd.png" alt="Item layout" /></p>
 </li>
 <li>Set the name and icon for the item.
-<p>The following functions set the name and icon for the item. You can pass the item name and the image file as a second parameter.</p>
+<p>You can pass the item name and image file as a second parameter.</p>
 <pre class="prettyprint">
 view_set_text(item_layout, &quot;recent.item.name&quot;, name);
 view_set_image(item_layout, &quot;recent.item.image&quot;, image_file);
 </pre>
 
-<p>The part named <span style="font-family: Courier New,Courier,monospace">recent.item.del</span> is attached as an IMAGE part. You can find this in the edj file and change the image file and the position.</p>
-<p>After creating the item, put the item in the box using the following function.</p>
+<p>The part named <span style="font-family: Courier New,Courier,monospace">recent.item.del</span> is attached as an IMAGE part. You can find this in the EDJ file and change the image file and the position.</p>
+<p>After creating the item, put the item in the box:</p>
 <pre class="prettyprint">
 elm_box_pack_start(ad-&gt;box, item_layout);
 </pre>
 </li>
-<li>Customize the position of the items using the following function:
+<li>Customize the position of the items:
 <pre class="prettyprint">
 elm_box_layout_set(box, _box_layout_cb, ad, NULL);
 </pre>
-<p>Whenever the size of box is changed because of deleting or adding an item, the <span style="font-family: Courier New,Courier,monospace">_box_layout_cb()</span> function is called. You can specify the location of the item wherever you want.</p>
+<p>Whenever the box size is changed because of deleting or adding an item, the <span style="font-family: Courier New,Courier,monospace">_box_layout_cb()</span> function is called. You can specify the location of the item wherever you want.</p>
 </li>
 </ol>
-<p>You can create a scroller, a box, and an item at once by calling the following function.</p>
+<p>You can create a scroller, box, and item together by calling the following function:</p>
 <pre class="prettyprint">
 Evas_Object *view_create_1text_1image_delbutton_item(appdata_s *ad, char *name, char *image_file);
 </pre>
-<p>The following figure illustrates the scroller, box, and item together.</p>
+<p>The following figure illustrates the scroller (pink), box (blue), and items (yellow) together.</p>
 <p class="figure">Figure: Scroller, box, and item</p>
 <p align="center"><img src="../images/taskmanager_scrollerboxitem_wearable_sd.png" alt="Scroller, box, and item" /></p>
 </li>
-<li><span style="font-family: Courier New,Courier,monospace">no.apps.page</span>
-<p>The <span style="font-family: Courier New,Courier,monospace">no.apps.page</span> is an empty page that is displayed when all items are deleted.</p>
-<p>This part is made of 2 text parts and 1 image part.</p>
-<p>The following figure illustrates the layout.</p>
+<li><span style="font-family: Courier New,Courier,monospace">no.apps.page</span> part is an empty page that is displayed when all items are deleted.
+<p>The part consists of 2 text parts and 1 image part.</p>
 <p class="figure">Figure: Empty page layout</p>
 <p align="center"><img src="../images/taskmanager_noapps_wearable_sd.png" alt="Empty page layout" /></p>
 
-<p>To fill out all these parts, call the following function.</p>
+<p>To fill out all these parts:</p>
 <pre class="prettyprint">
 no_apps_page = view_create_layout_for_part(parent, edj_path, GRP_NOAPPS_PAGE, &quot;no.apps.page&quot;);
 </pre>
 
-<p>Because all the parts are attached as an image and a text in the edj file, only the edj file name is required.</p>
-<p>In the edj file, you can find a group named <span style="font-family: Courier New,Courier,monospace">GRP_NOAPPS_PAGE</span>. To customize the shape, adjust the <span style="font-family: Courier New,Courier,monospace">GRP_NOAPPS_PAGE</span> in the edj file.</p>
+<p>Because all the parts are attached as an image and a text in the EDJ file, only the EDJ file name is required.</p>
+<p>In the EDJ file, you can find a group named <span style="font-family: Courier New,Courier,monospace">GRP_NOAPPS_PAGE</span>. To customize the shape, adjust the <span style="font-family: Courier New,Courier,monospace">GRP_NOAPPS_PAGE</span> group content in the EDJ file.</p>
 </li>
-<li><span style="font-family: Courier New,Courier,monospace">task.item.index</span>
-<p>This part is the index. The circle index occupies the full screen area, but it is displayed only in the top area of the screen.</p>
-<p>The following figure illustrates the index.</p>
+<li><span style="font-family: Courier New,Courier,monospace">task.item.index</span> part is the index.
+<p>The circle index occupies the full screen area, but it is displayed only in the top area of the screen.</p>
 <p class="figure">Figure: Index</p>
 <p align="center"><img src="../images/taskmanager_index_wearable_sd.png" alt="Index" /></p>
 
-<p>The following function creates the index.</p>
+<p>To create and show the index:</p>
 <pre class="prettyprint">
 Evas_Object *view_create_circular_index(appdata_s *ad);
-</pre>
-<p>After creating the index, call the following function to show it.</p>
-<pre class="prettyprint">
+
 void view_add_circular_index(appdata_s *ad, int idx);
 </pre>
 </li>
-<li><span style="font-family: Courier New,Courier,monospace">task.del.all.btn</span>
-<p>This part creates a button that deletes all items at once.</p>
-<p>The style of the button is provided, and you can customize the word displayed in the button.</p>
-<p>The following figure illustrates the button.</p>
+<li><span style="font-family: Courier New,Courier,monospace">task.del.all.btn</span> part creates a button that closes all items at once.
+<p>The style of the button is provided, and you can customize the text displayed on the button.</p>
 <p class="figure">Figure: Bottom button</p>
 <p align="center"><img src="../images/taskmanager_bottom_btn_wearable_sd.png" alt="Bottom button" /></p>
-<p>The following function creates the button.</p>
+<p>To create the button:</p>
 <pre class="prettyprint">
 Evas_Object *view_create_bottom_button(appdata_s *ad);
 </pre>
 </li>
 </ul>
 
-<h2>Main Operation</h2>
+<h3>Main Operation</h3>
 
-<p>The Task-manager sample carries out several operations.</p>
+<p>The Task-manager sample handles the following operations:</p>
 <ul>
 <li>Deleting items
-<p>To delete an item, the application exhanges signals caused by a part in the edj file.</p>
-<p>Set the program in the edj file to trigger a click event to delete the button named <span style="font-family: Courier New,Courier,monospace">delete.item.del</span>.</p>
+<p>To delete an item, the application exchanges signals caused by a part in the EDJ file.</p>
+<p>Set the program in the EDJ file to trigger a click event to delete the button named <span style="font-family: Courier New,Courier,monospace">delete.item.del</span>:</p>
  
 <pre class="prettyprint">
 part
@@ -199,18 +186,18 @@ programs
 &nbsp;&nbsp;&nbsp;}
 }
 </pre>
-<p>If the <span style="font-family: Courier New,Courier,monospace">mouse,clicked</span> event is detected from the <span style="font-family: Courier New,Courier,monospace">recent.item.del</span> part, send the <span style="font-family: Courier New,Courier,monospace">delete_button,clicked</span> signal with source named <span style="font-family: Courier New,Courier,monospace">clicked</span>.</p>
+<p>If the <span style="font-family: Courier New,Courier,monospace">mouse,clicked</span> event is detected from the <span style="font-family: Courier New,Courier,monospace">recent.item.del</span> part, the <span style="font-family: Courier New,Courier,monospace">delete_button,clicked</span> signal is sent with the source named <span style="font-family: Courier New,Courier,monospace">clicked</span>.</p>
 <p>To receive this signal, register a callback function to the item which is called when the signal is detected.</p>
-<p>In this example, if the <span style="font-family: Courier New,Courier,monospace">delete_button,clicked</span> signal is detected with the <span style="font-family: Courier New,Courier,monospace">clicked</span> source, the <span style="font-family: Courier New,Courier,monospace">_delete_btn_clicked_cb()</span> callback is called.</p>
+<p>In this example, if the <span style="font-family: Courier New,Courier,monospace">delete_button,clicked</span> signal is detected with the <span style="font-family: Courier New,Courier,monospace">clicked</span> source, the <span style="font-family: Courier New,Courier,monospace">_delete_btn_clicked_cb()</span> callback is called:</p>
 <pre class="prettyprint">
 elm_object_signal_callback_add(item_layout, &quot;delete_button,clicked&quot; &quot;clicked&quot;, _delete_btn_clicked_cb, ad);
 </pre>
 
 </li>
-<li>Showing the index according to the items and the current page
-<p>In both situation that the items are deleted or added and the page is moved, the index must be changed according to the items and pages.</p>
+<li>Showing the index according to the current number of items and the current page
+<p>Whenever items are deleted or added or the page is moved, the index must be changed accordingly.</p>
 <ol type="a">
-<li>Delete the item.
+<li>When an item is deleted, handle the index changes in the delete button click callback:
 <pre class="prettyprint">
 static void
 _delete_btn_clicked_cb(void *data, Evas_Object *obj, const char *emission, const char *source)
@@ -227,55 +214,46 @@ _delete_btn_clicked_cb(void *data, Evas_Object *obj, const char *emission, const
 &nbsp;&nbsp;&nbsp;elm_box_unpack(ad-&gt;box, cur_item);
 &nbsp;&nbsp;&nbsp;evas_object_del(cur_item);
 
+&nbsp;&nbsp;&nbsp;// Delete the index, and count the items that exist
 &nbsp;&nbsp;&nbsp;update_index(ad);
 }
 </pre>
+<p>Call the <span style="font-family: Courier New,Courier,monospace">update_index()</span>, <span style="font-family: Courier New,Courier,monospace">view_add_circular_index()</span>, and <span style="font-family: Courier New,Courier,monospace">view_sync_index_with_item()</span> functions to delete the current index, count the existing items, create a new index based on the number of items, and check and highlight the number of the currently shown item.</p>
 
-<p>The following functions are called:</p>
-<pre class="prettyprint">
-// Delete the index, and count the items that exist
-void update_index(appdata_s *ad);
-// Create an index according to the number of items 
-void view_add_circular_index(appdata_s *ad, int idx);
-// Check what number is the item showing and highlight the index of the same number
-void view_sync_index_with_item(appdata_s *ad);
-</pre>
 </li>
-<li>Move the page.
-<p>By calling the following functions, the application is able to synchronize the index properly.</p>
+<li>When the page is moved, handle the index changes in the scroller callback:
 <pre class="prettyprint">
 static void
 _scroller_scrolled_cb(void *data, Evas_Object *scroller, void *event_info)
 {
 &nbsp;&nbsp;&nbsp;appdata_s *ad = data;
+&nbsp;&nbsp;&nbsp;// Check which item number is showing and highlight the index of the same number
 &nbsp;&nbsp;&nbsp;view_sync_index_with_item(ad);
 }
-
-void view_sync_index_with_item(appdata_s *ad); // Check what number is the item showing and highlight the index of the same number
 </pre>
 </li>
 </ol>
 </li>
-<li>Closing all items.
-<p>You can close all items by 1 click only using an edj signal.</p>
-<p>The callback function registered on creation is called when the <span style="font-family: Courier New,Courier,monospace">bottom_button</span> is clicked.</p>
+<li>Closing all items
+<p>You can close all items together using an EDJ signal.</p>
+<p>The callback function registered when the bottom button was created is called when the <span style="font-family: Courier New,Courier,monospace">bottom_button</span> is clicked:</p>
 <pre class="prettyprint">
 evas_object_smart_callback_add(del_all_btn, &quot;clicked&quot;, _del_all_btn_clicked_cb, ad-&gt;layout);
 </pre>
-<p>In the <span style="font-family: Courier New,Courier,monospace">_del_all_btn_clicked_cb()</span> callback, send a signal named <span style="font-family: Courier New,Courier,monospace">del.all.item</span> with source <span style="font-family: Courier New,Courier,monospace">item.list</span> and signal named <span style="font-family: Courier New,Courier,monospace">noapps</span> with source <span style="font-family: Courier New,Courier,monospace">show,noapps</span> to edj.</p> 
+<p>In the callback, send a <span style="font-family: Courier New,Courier,monospace">del.all.item</span> signal with the <span style="font-family: Courier New,Courier,monospace">item.list</span> source and a <span style="font-family: Courier New,Courier,monospace">noapps</span> signal with the <span style="font-family: Courier New,Courier,monospace">show,noapps</span> source to EDJ:</p> 
 <pre class="prettyprint">
 static void 
 _del_all_btn_clicked_cb(void *data, Evas_Object *obj, void *event_info)
 {
 &nbsp;&nbsp;&nbsp;Evas_Object *layout = data 
 
-&nbsp;&nbsp;&nbsp;elm_object_signal_elmit(layout, &quot;del.all.item&quot;, &quot;item.list&quot;);
+&nbsp;&nbsp;&nbsp;elm_object_signal_emit(layout, &quot;del.all.item&quot;, &quot;item.list&quot;);
 &nbsp;&nbsp;&nbsp;bottom_button_disabled_set(layout, EINA_TRUE);
 &nbsp;&nbsp;&nbsp;elm_object_signal_emit(layout, &quot;noapps&quot;, &quot;show,noapps&quot;);
 }
 </pre>
 
-<p>In the edj, you must register programs to receive these signals.</p>
+<p>In the EDJ, register programs to receive these signals:</p>
 <pre class="prettyprint">
 programs
 {
@@ -300,7 +278,8 @@ programs
 }
 </pre>
 
-<p>This means that if these signals are detected with the sources, target changes their state to <span style="font-family: Courier New,Courier,monospace">noapps</span> and <span style="font-family: Courier New,Courier,monospace">hide</span>.</p>
+<p>When these signals are detected with the sources, the above programs change the state of the targets to <span style="font-family: Courier New,Courier,monospace">noapps</span> and <span style="font-family: Courier New,Courier,monospace">hide</span>.</p>
+<p>The target part descriptions define the part content in these states. The item list (<span style="font-family: Courier New,Courier,monospace">task.item.list</span>) is hidden, and the empty page (<span style="font-family: Courier New,Courier,monospace">no.apps.page</span>) is shown.</p>
 <pre class="prettyprint">
 part 
 {
@@ -337,7 +316,7 @@ part
 &nbsp;&nbsp;&nbsp;}
 }
 </pre>
-<p>To customise this application, see the functions in the <span style="font-family: Courier New,Courier,monospace">view.h</span> header file. This application is easy to customize with different variables and parameters.</p>
+<p>To customize the application, see the functions in the <span style="font-family: Courier New,Courier,monospace">view.h</span> header file. You can easily customize the application using various variables and parameters.</p>
 </li>
 </ul>
 
index 30b56be..0c13838 100644 (file)
 <body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
 
 <div id="toc-navigation">
-
+</div> 
 <div id="container"><div id="contents"><div class="content">
 
        <div id="profile">
                <p><img alt="Wearable native" src="../images/wearable_s_n.png"/></p>
        </div>
        
-</div> 
+
 
 
 <h1>World Clock Widget Sample Overview</h1> 
 
-<p>The World Clock widget sample demonstrates how to manage text objects and image objects to create a complete widget view.</p>
-<p>The following figure illustrates the main screen of the World Clock widget.</p>
-<p class="figure">Figure: World Clock main view</p>
-<p align="center"><img src="../images/worldclock_wearable_sd.png" alt="World Clock main view" /></p>
+<p>The World Clock Widget sample application demonstrates how to manage text objects and image objects to create a complete widget view.</p>
+<p>The following figure illustrates the main screen of the World Clock Widget.</p>
+<p class="figure">Figure: World Clock Widget main view</p>
+<p align="center"><img src="../images/worldclock_wearable_sd.png" alt="World Clock Widget main view" /></p>
+
+<p>The application displays the current time and date in a specific location.</p> 
 
-<p>This sample consists of the view and main operation parts.</p> 
+<h2>Implementation</h2>
 
-<h2>View</h2
+<h3>View</h3
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_create()</span> function creates the widget view frame that consists of the window, text parts, and image parts.</p>
 <pre class="prettyprint">
 view_create(context, w, h);
 </pre>
-<p>The following figure illustrates the view frame.</p>
-<p class="figure">Figure: World Clock view frame</p>
-<p align="center"><img src="../images/worldclock_structure_wearable_sd.png" alt="World Clock view frame" /></p>
+<p class="figure">Figure: World Clock Widget view frame</p>
+<p align="center"><img src="../images/worldclock_structure_wearable_sd.png" alt="World Clock Widget view frame" /></p>
 
 <p>To create the parts:</p>
 <ul>
 <li>Text
 <p>You can fill out the text parts with the part name and the text using the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function.</p>
-<p>Implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
+<p>First, implement the <span style="font-family: Courier New,Courier,monospace">data_get_text()</span> function to create the text you want to use. In this function, you can also choose the part name which you want to fill out. Then, call the <span style="font-family: Courier New,Courier,monospace">view_set_text()</span> function with the part name and text you obtained.</p>
 <p>In this example, the text to use is <span style="font-family: Courier New,Courier,monospace">region_txt</span> and the part name to fill out is <span style="font-family: Courier New,Courier,monospace">widget.region</span>.</p>
 <pre class="prettyprint">
 region_txt = data_get_text(&quot;widget.region&quot;);
@@ -58,7 +59,7 @@ view_set_text(wid, &quot;widget.region&quot;, region_txt);
 </pre>
 </li>
 <li>Image
-<p>You can create the widget with image files using the <span style="font-family: Courier New,Courier,monospace">view_set_image()</span> function. Pass the part name which you want to draw and the name of image file including its directory path.</p>
+<p>You can create the widget with image files using the <span style="font-family: Courier New,Courier,monospace">view_set_image()</span> function. Pass the part name which you want to draw and the name of the image file including its directory path.</p>
 <p>In this example, the part name is <span style="font-family: Courier New,Courier,monospace">widget.bg</span> and the name of image file is <span style="font-family: Courier New,Courier,monospace">bg.png</span> in the <span style="font-family: Courier New,Courier,monospace">images</span> directory.</p>
 <pre class="prettyprint">
 view_set_image(wid, &quot;widget.bg&quot;, &quot;images/bg.png&quot;);
@@ -66,16 +67,16 @@ view_set_image(wid, &quot;widget.bg&quot;, &quot;images/bg.png&quot;);
 </li>
 </ul>
 
-<h2>Main Operation</h2>
+<h3>Main Operation</h3>
 
 <p>The <span style="font-family: Courier New,Courier,monospace">view_set_event_callback()</span> function controls the widget main operation that launches the application.</p>
 <p>The launch options are:</p>
 <ul>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_PRESSED</span> for launch on a touch press event</li>
 <li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_RELEASED</span> for launch on a touch release event </li>
-<li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span>for launch on a click event</li>
+<li><span style="font-family: Courier New,Courier,monospace">WIDGET_EVENT_CLICKED</span> for launch on a click event</li>
 </ul>
-<p>In this example, the application is launched when you click the widget.</p>
+<p>In this example, the application is launched when you click the widget:</p>
 <pre class="prettyprint">
 view_set_event_callback(wid, &quot;widget.event&quot;, WIDGET_EVENT_CLICKED, clicked_cb);
 </pre>